可以：not（）伪类有多个参数吗？

Question

可以：not（）伪类有多个参数吗？

我正在尝试选择除了和之外input的所有元素。typeradiocheckbox

很多人已经表明你可以放入多个参数:not，但是使用type似乎无论如何都没有用到我试试。

form input:not([type="radio"], [type="checkbox"]) {
  /* css here */}

有任何想法吗？

Answer 1

原因：不只是使用两个:not：input:not([type="radio"]):not([type="checkbox"])是的，这是有意的

Answer 2

如果您在项目中使用SASS，我已经构建了这个mixin，使其按照我们想要的方式工作：@mixin not($ignorList...) {     //if only a single value given     @if (length($ignorList) == 1){         //it is probably a list variable so set ignore list to the variable         $ignorList: nth($ignorList,1);     }     //set up an empty $notOutput variable     $notOutput: '';     //for each item in the list     @each $not in $ignorList {         //generate a :not([ignored_item]) segment for each item in the ignore list and put them back to back         $notOutput: $notOutput + ':not(#{$not})';     }     //output the full :not() rule including all ignored items     &#{$notOutput} {         @content;     }}它可以以两种方式使用：选项1：列出内联忽略的项目input {   /*non-ignored styling goes here*/   @include not('[type="radio"]','[type="checkbox"]'){     /*ignored styling goes here*/   }}选项2：首先列出变量中被忽略的项目$ignoredItems:   '[type="radio"]',   '[type="checkbox"]';input {   /*non-ignored styling goes here*/   @include not($ignoredItems){     /*ignored styling goes here*/   }}两个选项的输出CSSinput {     /*non-ignored styling goes here*/}input:not([type="radio"]):not([type="checkbox"]) {     /*ignored styling goes here*/}

Answer 3

从CSS 4开始，:not可以在选择器中使用多个参数（参见此处）。在CSS3中，：not selector仅允许1个选择器作为参数。在第4级选择器中，它可以将选择器列表作为参数。例：/* In this example, all p elements will be red, except for     the first child and the ones with the class special. */p:not(:first-child, .special) {   color: red;}不幸的是，浏览器支持有限。目前，它只适用于Safari。