CSSクラス内の要素を除外

Question

"not"タグがあることは知っていますが、この場合はどのように適用するのかわかりません。

私はこのクラスの中に何か言いたいことがあります

HTMLの構造。

<div> 
    <span></span> 
    HERE IS TEXT THAT NEEDS CSS. 
</div> 

CSS

div not:span { 
     text-shadow: 1px 1px #000, 1px -1px #000, 1px 0 #000, -1px 1px #000, -1px -1px #000, -1px 0 #000, 0 1px #000, 0 -1px #000; 
} 

Answer 1

あなたはtext-shadow: none

div { 
 
    text-shadow: 1px 1px #000, 1px -1px #000, 1px 0 #000, -1px 1px #000, -1px -1px #000, -1px 0 #000, 0 1px #000, 0 -1px #000; 
 
} 
 
span { 
 
    text-shadow: none; 
 
}

<div> 
 
    <span>Span</span> 
 
    HERE IS TEXT THAT NEEDS CSS. 
 
</div>

それとも、別のスパンでテキストを配置し、使用することができるとスパンのスタイルを上書きすることができますdiv span:not(:first-child)

div span:not(:first-child) { 
 
    text-shadow: 1px 1px #000, 1px -1px #000, 1px 0 #000, -1px 1px #000, -1px -1px #000, -1px 0 #000, 0 1px #000, 0 -1px #000; 
 
}

<div> 
 
    <span>Span</span> 
 
    <span> HERE IS TEXT THAT NEEDS CSS.</span> 
 
</div>

Answer 2

カップルの事があります。

1. あなたが適切に:not()セレクタを使用していません。 not:spanの代わりに:not(span)と言う必要があります。
2. テキストはタグ内にないので、div自体に属しているため、divの子ではありません。 <div>、<p>、<h3>などのテキストを入力すると、コードが機能します。

div :not(span) { 
 
    text-shadow: 1px 1px #000, 1px -1px #000, 1px 0 #000, -1px 1px #000, -1px -1px #000, -1px 0 #000, 0 1px #000, 0 -1px #000; 
 
}

<div> 
 
    <span>Span</span> 
 
    <div>HERE IS TEXT THAT NEEDS CSS.</div> 
 
</div>

JSFiddle