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

【问题标题】：How to format a button with in Form tag, html?如何在表单标签、html 中格式化按钮？
【发布时间】：2015-07-25 12:23:29
【问题描述】：

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

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

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

【问题讨论】：

【解决方案1】：

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

input[type=submit] 是选择器。

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

【讨论】：

【解决方案2】：

表单没有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>

【讨论】：

【解决方案3】：

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

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

在本例中，我为您的按钮添加了一个类。

.button {
    border: 1px solid black;
}

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

【讨论】：