Eu tenho um código css que poderia fazer a página inteira em escala de cinza.

<style type="text/css">
html {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);
}
</style>

Agora, quero incorporar um iframe em uma div que não seja afetada. Eu pesquisei sobre a solução e fonte: não seletor. Quando me refiro à 6.6.7 emhttp://www.w3.org/TR/css3-selectors/#negation Eu acho que encontrei a solução, porque pode funcionar, mesmo eu colocar html como meu seletor de css

html|:not(x)

Então, mudei o código exatamente como o código acima, mas nada mudou. Eu estava preocupado com o problema causado pelo design do meu site, então decidi codificá-los em jsfiddle no HTML mais simples

<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>

Em CSS

html|*:not(.abc) {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%); }

Ligação:http://jsfiddle.net/4vxyqdye/1/ PS: Na versão anterior, usei: não apenas (.abc), mas todos os elementos se tornam em escala de cinza.