我看不到继续按钮

Question

我是一名初级程序员，在 Visual Studio 开发基于文本的游戏，网页上没有显示继续按钮。我错过了什么吗？

            <p></p>
            <fieldset></fieldset>
            <button id="resetButton" class="reset">Restart</button>
            <a id="continueButton" class="continue" href="javascript:void(0);"></a>
        </form>
    </div>
    <script> src="js.js"></script>
</body>
</html>

Answer 1

您在 a 标签中没有任何文字。

<a id="continueButton" class="continue" href="javascript:void(0);">PUT YOUR TEXT HERE</a>

Answer 2

您的 continueButton 元素使用的是 <a> 标记，其中没有任何内容，因此没有可显示的内容。在您的 <a> 标签内添加一些内容，或将其更改为 <button>，如 resetButton 元素。

<html>
    <body>
        <button id="resetButton" class="reset">Restart</button>
        <a id="continueButton" class="continue" href="javascript:void(0);">Continue</a>
    </body>
</html>

Answer 3

解决此问题的另一种方法是在浏览器上使用开发人员工具（就我个人而言，我喜欢 Firefox）。正如您从图像中看到的那样，右侧有一些东西称为已选择的 a 标签的框模型。

a 标签的高度是 16 而宽度是 0。这对于您在浏览器上看到的内容很有意义。您有一个 0x16 的盒子（在盒子模型下）。

现在，如果我在 a 标签之间添加一些文本（添加文本 AAA），您可以看到该框现在是 34.65x16.

学习盒模型的一些资源：

https://web.dev/learn/css/box-model/ https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/The_box_model

我看不到继续按钮

I can't see the continue button

html

javascript

macos

visual-studio

text-based