2025-02-12 05:00:11

CSS复选框输入样式

输入的任何样式都会影响每个输入元素。是否有一种方法可以指定样式只应用于复选框,而不对每个复选框元素应用类?


当前回答

input[type="checkbox"] {
 /* your style */
}

但这只适用于IE7及以下浏览器,对于那些你必须使用类的浏览器。

其他回答

课程也很好用,比如:

<style>
  form input .checkbox
  {
    /* your checkbox styling */
  }
</style>

<form>
  <input class="checkbox" type="checkbox" />
</form>

使用css2,你可以这样做:

input[type='checkbox'] { ... }

到目前为止,这应该得到了相当广泛的支持。参见浏览器支持

你可以通过以下方法应用到特定属性:

input[type="checkbox"] {...}

这里有解释。

input[type="checkbox"] {
 /* your style */
}

但这只适用于IE7及以下浏览器,对于那些你必须使用类的浏览器。

虽然CSS确实为您提供了一种方法来执行特定于复选框类型或其他类型的样式,但不支持这种样式的浏览器将会出现问题。

我认为在这种情况下,您唯一的选择是将类应用到复选框中。

只需将class="checkbox"添加到您的复选框中。

然后在css代码中创建该样式。

你可以这样做:

main.css

input[type="checkbox"] { /* css code here */ }

ie.css

.checkbox{ /* css code here for ie */ }

然后使用IE特定的css包括:

<!--[if lt IE 7]>
   <link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->

您仍然需要添加类,以便它在IE中工作,并且它不能在其他不支持IE的非IE浏览器中工作。但是它会使你的网站具有前瞻性的css代码,随着IE得到支持,你将能够从复选框中删除IE特定的css代码和css类。