css - css の display none プロパティを段落に適用する

Question

私はcssに取り組んでおり、divクラス "" abcのpタグ幅参照を表示したくないのですが、そうすることができません。また、自動生成としてpタグにクラスを配置することもできないため、参照の使用は必須ですが、正しいです仕方。助けてください。

ここにhtmlがあります：

<div class="abc">any text</div>
<p>any text here</p>

これが私がこれまでに試したcssです：

.abc p{ display:none}

しかし、私はそれが正しくないことを知っています。Googleでも検索しましたが、運がありません。

Answer 1

隣接する兄弟セレクター を試してください+。前の要素の直前にある要素のみを選択します。

.abc + p{ display:none}

jsFiddle の例

Answer 2

その CSS を機能させるには、div 内に段落を含める必要があります。

<div class="abc"><p>any text here</p></div>

または、マークアップを指定すると、兄弟セレクター:

.abc + p { display:none }