如何仅将属性应用于提交按钮

Question

我想规范化页面中的一些元素，比如在提交按钮上添加一些边距/填充。

尝试使用input.submit {margin:0; padding:1px 6px 1px 6px;}，但似乎无效。我怎么能用CSS 2.1做到这一点？

Answer 1

最可靠的CSS 2.1我认为您可以选择将class或id应用于按钮，或隔离特定父元素内的按钮。

否则CSS 2.1 支持attribute=value选择符表示法，所以：

input[type=submit],
/* or */
button[type=submit]

应该有效。然而，这在Internet Explorer中变化可靠（尽管令我惊讶的是，根据PPK, of Quirksmode，在IE＆gt; = 7中可用。

已编辑以进一步探讨此问题：

input.submit {margin:0; padding:1px 6px 1px 6px;}“不起作用的原因”是因为该选择器input.submit会选择input个类名为submit的元素。除非你给出了class-name的提交按钮，否则你的html中没有匹配的元素。

使用jQuery可以将提交元素与选择器$('input:submit')匹配，但这不是一个有效的CSS选择器（据我目前所知）;如上所述，CSS可以提供​​的最近的东西是input[type=submit]。

---

进一步参考：CSS2 [attr] selector, at Quirksmode.org。

Answer 2

在兼容CSS3的浏览器中，您可以使用：

input[type="submit"] {margin:0; padding:1px 6px 1px 6px;}

如果你不能使用CSS3，你必须在提交输入上设置一个类：

<input type="submit" class="submit" value="Submit form" />

Answer 3

是。 input[type="submit"]是一个有效的CSS 2.1选择器。

来源：W3C CSS Selectors