html - css の p .classname{} と .classname p{} の違いは何ですか?

Question

段落の色を赤にする必要がありますか?

1. p .target{color:red;font-size:18px};

2. .target p{color:red;font-size:18px};

どちらが機能し、HTML ドキュメントのレンダリングに対してどのように動作するか。

Answer 1

あなたはここで2つの異なることについて話している.

CSS プロパティは次のように解釈されます。parent child { property}

例 1 では、ノードtargetの子孫ノードでクラス名を持つノードを探しpます。

<div class="target">
  <p>I am in red</p>
</div>

p例 2 では、という名前のクラスの子孫ノードでタグを探しています。target

<p>
   <span class="target">I am in red now</span>
</p>