【CSS】not()で複数条件(AND・OR)セレクタを除外するサンプル

2018年3月31日CSSCSSデザイン

CSSでセレクタ指定時に除外できるnot()疑似クラス

AND条件やOR条件の指定方法です

divを除外

div以外の全ての要素に適用するCSSです

body:not(div){
color:#000;
}

divまたはpを除外

divとp以外の全ての要素に適用するCSSです

body:not(div):not(p){
color:#000;
}

divでclass名がaaaまたはbbbを除外

class名がaaaまたはbbb以外の要素に適用するCSSです

body:not(.aaa, .bbb){
color:#000;
}

divかつclassなし

divでかつclassが定義されていない要素に適用するCSSです

body:not(div):not([class]){
color:#000;
}

divかつclass名がaaa以外

divでかつclass名がaaaまたは.bbb以外の要素に適用するCSSです

div:not(div):not(.aaa, .bbb){
color:#000;
}

2018年3月31日CSSCSSデザイン

Posted by Yousuke.U