有问题：不是（.class）选择器和CSS3过滤器

Question

Demo

我正在尝试将Filter应用于Only Parent div并使用CSS

跳过Child div的过滤器

  

：否（的.class）{}

选择器为

.main:not(.nofilter) {
 -webkit-filter: blur(3px);
}

但正如您在演示中所看到的，Filter也在申请子div .nofilter！能告诉我如何解决这个问题吗？

由于

Answer 1

nofilter不适用于父本身，而是适用于子div元素。因此.main:not(.nofilter)将匹配.main。

  

我正在尝试将Filter应用于Only parent div并跳过此   过滤器为儿童div

我担心这是不可能的。当您尝试覆盖子元素的父项的opacity时，会发生同样的事情。

或者，如果您只想对背景图像应用模糊滤镜，则可以采用以下解决方法：

• How to apply a CSS 3 blur filter to a background image

Answer 2

你必须直接解决孩子的问题，并且适用：不是（）然后

.main > div:not(.nofilter) {
 -webkit-filter: blur(3px);
}

http://jsfiddle.net/ex7a4aj7/1/