你如何在CSS中选择一个单选按钮?

Bre*_*ski 39 css

你如何在CSS中选择一个单选按钮?我正在使用的HTML生成,所以我不能添加类或其他属性.

我在互联网上找到了输入[type ="radio"],但我不知道这是否是普通的CSS,并且大多数浏览器都支持.

有没有其他方法可以选择单选按钮?

谢谢,

布雷特

Eva*_*her 64

input[type="radio"]属性选择器的示例.它是CSS3规范的一部分,完全合法.唯一不支持它们的浏览器是IE6.如果支持IE6对项目很重要,那么你应该考虑在相关的单选按钮中添加类.

这是一篇文章,其中有一个如何有效使用属性选择器的示例.有关CSS3好东西的更多信息,请查看此文章.

  • 这不是CSS3的好东西 - 它实际上是CSS2的一部分.所以IE6没有理由缺乏支持. (3认同)

ann*_*ata 9

属性选择器(input [type ="radio"])是正确的解决方案,除了IE6之外的所有东西都广泛支持:)

如果您无法修改HTML以注入classname支持(或访问javascript来完成此操作),那么您的选项是:

一个).确保您的网站不依赖于此,并允许IE6优雅地降级.

B).没有它


Jos*_*osh 5

您可以使用jQuery来选择输入并动态添加一个类。

示例(来源: http: //docs.jquery.com/Attributes/addClass#class):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>
  $(document).ready(function(){
    $("p:last").addClass("selected highlight");
  });
  </script>
  <style>
  p { margin: 8px; font-size:16px; }
  .selected { color:red; }
  .highlight { background:yellow; }
  </style>
</head>
<body>
  <p>Hello</p>
  <p>and</p>
  <p>Goodbye</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

[编辑]

jQuery 的替代方法是使用 http://code.google.com/p/ie7-js/

它修复了 ie 版本低于 7 的大量问题,您最感兴趣的修复如下所示:

http://ie7-js.googlecode.com/svn/test/attr-value.html