「CSS」not()でセレクターに一致しない要素を取得する方法

2014年8月2日2020年10月13日

説明
:not() 擬似クラスは引数として、1つまたは複数のセレクターをカンマで区切ったものを要求します。
リストには否定セレクターや擬似要素を含めることはできません。
htmlコード

<p>AA001.</p>
<p class="cps">BB002!</p>
<div>this is e a test.</div>

CSSコード

.cps {
  text-shadow: 3px 4px 5px gold;
}
/* '.cft' クラスの中にない <p> 要素 */
p:not(.cft) {
  color: red;
}
 /* <p> 要素ではない要素 */ 
body :not(p) {
 　text-decoration:none;
}
/* <div> または <span> 要素ではない要素 */
body :not(div):not(span) {
  font-size:0.8em;
  padding:10px 0;
}