css – 这两个选择器使用“:not”有什么区别?

前端之家收集整理的这篇文章主要介绍了css – 这两个选择器使用“:not”有什么区别?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这两个选择器有什么区别?
input:not([type="radio"][type="submit"])
input:not([type="radio"]):not([type="submit"])

将<输入>选择没有类型属性标签

我读了:

> Css pseudo classes input:not(disabled)not:[type=”submit”]:focus
> CSS: multiple attribute selector

解决方法

引用 the Selector Level 4 docs

The negation pseudo-class,:not(),is a functional pseudo-class taking
a selector list as an argument. It represents an element that is not
represented by its argument.

Note: In Selectors Level 3,only a single simple selector was allowed
as the argument to :not()
.

这就解释了为什么……

input:not([type="radio"][type="submit"])

…没有实现这部分CSS4规范的任何浏览器都不支持(据我所知,此时没有人这么做;毕竟它只是一个工作草案).但是这个选择器的逻辑也存在缺陷:即使普遍支持语法,它也应该写成……

input:not([type="radio"],[type="submit"])

请参阅,[foo] [bar]规则被视为要求任何元素都是foo和bar.但是(当然!)任何输入都不可能是无线电和提交类型.

底线:你必须使用……

input:not([type="radio"]):not([type="submit"])

…因为CSS3 only supports simple selectors in:not.

猜你在找的CSS相关文章