Question

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

CSS Selectors

ie6不支持

： Support for CSS selectors in IE6（查找文本“属性选择器”）

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

Answer 1

遗憾的是，如果不使用一堆无关的类选择器来编写HTML，这是不可能的。

我建议您设计一个网站，以便您的完全有效的CSS适用于使用现代浏览器的用户，并且它仍然可以在IE6中使用，尽管在视觉上不太正确。您只需要在让您的网站升级到标准之间找到适当的平衡，并为不升级的用户向后弯腰。这是一个破碎的浏览器，对待它。

Answer 2

由于IE6基本上仅限于：

班级选择器
ID选择器
（空格）后代选择器
a：-only pseudo-selectors

您唯一的选择是：

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

我发现利用通过用空格分隔多个类来为元素分配多个类的能力非常有用：class="foo bar"

Answer 3

如果你想在IE6中使用属性选择器，你可以使用Dean Edward IE.js. http://dean.edwards.name/IE7/

这将使IE 5+的行为更像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()

我没有IE6（使用IE7）所以我不能说它有用，但试一试

Answer 4

您可以使用Internet Explorer CSS表达式结合安全下划线（“_”，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;
}

我确实理解，你确实要求“有效”的CSS，但是如果上面的CSS破解了你，那么请阅读Safe CSS Hacks。

以上内容可以改为：

.ie6 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]-->

Answer 5

Dean Edwards'IE7 JavaScript library为IE 5和6提供attribute selector support。

Answer 6

遗憾的是，使用类，这是唯一的解决方法。

Answer 7

如果您在自己的网站上使用jQuery，另一个选项是SuperSelectors - 它会遍历您网站的样式表，动态地向元素添加类，这样即使是IE6也可以充分发挥正确支持CSS选择器的作用，例如{ {1}}。

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

7 个答案: