如何在表单标签 html 中格式化按钮？

Question

我正在使用以下方法将 link 按钮添加到另一个页面：

<TD>
    <FORM METHOD="LINK" ACTION="page2.html">
        <INPUT TYPE="submit" VALUE="to Page 2">
    </FORM>
</TD>

我知道我们可以在 CSS 中使用 button{...} 来改变按钮的外观，但是如果按钮是在上面的表单标签中，我们如何格式化它？ 谢谢你的帮助。

Answer 1

Css 将是：input[type=submit] {background-color: #999;}

input[type=submit] 是选择器。

您可以向此样式添加任何规则

Answer 2

Css 使用选择器设置元素样式。选择器可以是很多东西，比如 classes、元素属性或名称。这些选择器中的大多数都不会关心您的按钮是否在表单中。

<TD>
    <FORM METHOD="LINK" ACTION="page2.html">
         <INPUT TYPE="submit" class="button" VALUE="to Page 2">
    </FORM>
</TD>

在此示例中，我向您的按钮添加了 class。

.button {
    border: 1px solid black;
}

然后这个 css 规则会将其连接到所有具有按钮 class 的元素。这是一个很好的基础入门，它解释了 css 的工作原理：

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started/Selectors

Answer 3

表单没有 method="link"，您不需要表单即可转到另一页。

使用a：

<a href="page2.html">to Page 2</a>

或者如果你想要一个按钮：

<button onclick="javascript:window.location.href='page2.html';">to Page 2</button>

并给它一个 id 像 <button id="btn" ... 然后你可以给它任何你想要的样式：

<style type="text/css">
    #btn {
        background-color: green;
        color: white;
        font-weight: bold;
        /* etc */
    }
</style>