我有一段CSS代码可以将整个页面变为灰阶。
在CSS中:
<style type="text/css">
html {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}
</style>
我现在想要将一个iframe嵌入到一个不受影响的div中。我已经搜索了这个问题的解决方案,并发现了“:not”选择器。当我参考http://www.w3.org/TR/css3-selectors/#negation文档的第6.6.7章节时,我认为我已经找到了解决方案,因为它即使作为HTML也可以作为我的CSS选择器。
html|:not(x)
所以我像上面的代码一样改变了代码,但是什么也没有改变。我担心问题是由于我的网站设计引起的,所以我决定在jsfiddle中编写它们,使用最简单的HTML。
<div id="abc" class="abc"><font color="red">This should be a normal text.</font></div>
<font color="red">This should be an affected text.</font>
在CSS中:
html|*:not(.abc) {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%); }
链接:http://jsfiddle.net/4vxyqdye/1/ PS:在以前的版本中,我只使用了:not(.abc),但是所有元素都变成了灰度。