CSS的“contains”属性选择器在IE8中不起作用。

Question

CSS的“contains”属性选择器在IE8中不起作用。

3

我希望能够根据图片的浮动方式更改外边距。我使用了“contains”属性选择器，这个方法很好，但在IE8中不起作用。请参考下面的代码。

由于HTML是通过Drupal内部的所见即所得编辑器生成的，因此我不能真正地修改HTML（例如无法添加标识元素的类）。

有没有人可以提供替代方法来针对“float:left”？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
img[style*="float"][style*="left"]
{
    margin: 40px;
    background: red;
}
</style>
</head>
<body>
<img src="http://jsfiddle.net/img/logo.png" style="float:left" width="100" height="100">
</body>
</html>

我还创建了一个 jsfiddle，但它在 IE8 上存在问题：http://jsfiddle.net/spiderplant0/FAxmp/

- spiderplant0

1

在IE8上打开：http://fiddle.jshell.net/spiderplant0/FAxmp/show/light/ - RaphaelDDL

@RaphaelDDL，谢谢。我也使用这个链接看到了这个错误。你在IE8中也看到了这个错误吗？ - spiderplant0

刚刚在Windows XP（在VmWare中）的IE8上测试了一下，发现问题仍然存在。 - spiderplant0

尝试使用jQuery进行选择，但在IE8中也失败了... http://fiddle.jshell.net/spiderplant0/KZGFD/show/light/ - spiderplant0

蜘蛛，尝试一下@GCyrillus在答案中说的：“重新编辑似乎只解析样式值，而不是规则。”仅使用img[style*=left]进行测试。如果GC所说的是真的，那么可能会起作用。但是，如果有任何没有浮动但具有text-align:left;的图像，则也将被选中。 - RaphaelDDL

显示剩余2条评论

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- G-Cyrillus · Accepted Answer

你需要一个polyfill，如果你已经使用js框架，那么很容易实现: http://selectivizr.com/
但还有其他选择。
编辑：据你所说，你已经在使用一个。

ie9.js

为了使polyfills更有效，请确保你的样式已经放在外部文件中，并且没有使用@import进行链接。
谢谢。

重新编辑：看起来它只解析样式的值，而不是规则。

因此，以下选择器将在IE8上工作：

img[style*=left] {
    /* css */
}