Javascript 如何解决：IE6不支持CSS“；属性"；选择器_Javascript_Css_Internet Explorer_Internet Explorer 6_Css Selectors

Javascript 如何解决：IE6不支持CSS“；属性"；选择器

javascript css internet-explorer

Javascript 如何解决：IE6不支持CSS“；属性"；选择器,javascript,css,internet-explorer,internet-explorer-6,css-selectors,Javascript,Css,Internet Explorer,Internet Explorer 6,Css Selectors,我正在处理的一个项目使用CSS“属性”选择器[att] ie6不支持：（查找文本“属性选择器”）是否有任何解决方法/黑客当然是有效的html/css来克服这个问题？因为IE6基本上限于：类选择器 ID选择器（空格）后代选择器 a:-仅伪选择器您唯一的选择是：使用更多类来标识元素使用JavaScript（强烈除非在高度专业化的情况下，否则不建议使用）我发现，通过使用空格分隔多个类来为一个元素分配多个类是非常有帮助的：class=“foo bar”使用类，这是唯一的解决方法

我正在处理的一个项目使用CSS“属性”选择器[att]

ie6不支持：（查找文本“属性选择器”）

是否有任何解决方法/黑客当然是有效的html/css来克服这个问题？

因为IE6基本上限于：

类选择器
ID选择器
（空格）后代选择器
a:-仅伪选择器

您唯一的选择是：

使用更多类来标识元素
使用JavaScript（强烈除非在高度专业化的情况下，否则不建议使用）

我发现，通过使用空格分隔多个类来为一个元素分配多个类是非常有帮助的：

class=“foo bar”

使用类，这是唯一的解决方法，很遗憾。如果不在HTML中添加一堆无关的类选择器，这是不可能的

我建议你设计你的网站，使你的完全有效的CSS适合使用现代浏览器的人，并且它在IE6中仍然可用，尽管视觉上不太正确。你只需要在让你的网站达到标准和为不升级的用户竭尽全力之间找到正确的平衡。这是一个坏掉的浏览器，请将其视为坏掉的。

迪安·爱德华兹为IE5和IE6提供了支持。

如果您想在IE6中使用属性选择器，可以使用迪安·爱德华兹IE.js。

这将使IE5+的行为更像IE7

supports the following CSS selectors: parent > child adjacent + sibling adjacent ~ sibling [attr], [attr="value"], [attr~="value"] etc .multiple.classes (fixes bug) :hover, :active, :focus (for all elements) :first-child, :last-child, only-child, nth-child, nth-last-child :checked, :disabled, :enabled :empty, :contains(), :not() :before/:after/content: :lang() 支持以下CSS选择器：父项>子项相邻+兄弟相邻兄弟姐妹 [attr]、[attr=“value”]、[attr~=“value”]等 .multiple.class（修复错误）：悬停、：活动、：焦点（适用于所有元素）：第一个孩子，：最后一个孩子，独生子女，第n个孩子，第n个最后一个孩子：选中，：禁用，：启用：empty，：contains（），：not（）：before/：after/内容：：lang（）

我没有IE6（使用IE7），所以我不能说它有效，但是试一试如果你在你的网站上使用jQuery，另一个选择是-它会遍历你的网站的样式表，动态地向元素添加类，这样即使是IE6也可以享受到正确支持CSS选择器的光辉，比如

ul li:first child li:nth child（odd）答：悬停

您可以将Internet Explorer CSS表达式与安全下划线（“25;”、IE6和更早版本）CSS hack结合使用：

/* Adds dotted bottom border to `<ABBR>` with a `title` attribute. */
abbr {
        _border-bottom: expression(this.title ? '1px dotted' : 'none');
}

abbr[title] {
        border-bottom: 1px dotted;
}

也就是说，如果您的HTML以以下形式开始：

<!--[if lt IE 7]><html class="ie6"><![endif]-->
<!--[if IE 7]>   <html class="ie7"><![endif]-->
<!--[if IE 8]>   <html class="ie8"><![endif]-->
<!--[if gt IE 8]><!--><html><!--<![endif]-->

是有效的html吗？@ngm否，没有重复的属性规范allowed@ngm但是，您可以使用class=“foo-bar”@Rex M和@Ngm，IE6会忽略多个类名样式，例如..foo.bar{}@ndorfin这是正确的，但与本例中的要点无关。IE6不能针对同一级别上的多个类，这并不意味着我们不能使用多个类对重叠的元素集应用不同的样式。html有效吗？使用class=“button bar”instead@ngm您可以使用class=“foo bar”是的，这是前进的方向。开发人员必须停止在IE6中实现像素完美的尝试。例如，我使用：first-child伪选择器设置了一些列，以删除第一列的左边距。对于IE6，我只是将边距缩小了，这样就不会弄乱它。CSS表达式是可能的。请看，这是一个很好的选择，但请注意，（这不是根据经验，而是通过查看代码及其实现支持的方式），您的CSS规则不会自动“应用”到通过JS发生的元素动态更改-添加类、元素等将不会获得原始的CSS规则。+1表示expression（）语句。12年来，我一直在建立网站和制作CSS，这是我有生以来第一次看到这种奇形怪状的酷东西！它在IE8中不起作用。由于安全问题，他们最终把它取了出来，但它在IE7中确实有效。IE在CSS中还有一个叫做“行为”的东西。

<!--[if lt IE 7]><html class="ie6"><![endif]-->
<!--[if IE 7]>   <html class="ie7"><![endif]-->
<!--[if IE 8]>   <html class="ie8"><![endif]-->
<!--[if gt IE 8]><!--><html><!--<![endif]-->