CSS「>」の意味

普段、classやIDでcssを設定しているが、「>」をcssファイルで見つけた。

Contents

「>」を使うと、直下の要素にのみスタイルを適用できる。例えば、divでやってみると、

div>li
{
   background_color: blue;
}

とした場合には、以下のリストのデータ1にだけスタイルが適用される。
（別に個別にクラスを適用しても良いが、特定の要素にだけ適用させたい場合には使用）

<ol>
  <li>データ1</li>
  <li>データ2</li>
  <li>データ3</li>
</ol>

ただ、base.cssの他に、ページごとのcssファイルを設定していたり、優先順位を予めheadに記述している場合には、どのファイルにcssを書くか、

あとはインラインで書いてないかとか優先順位には気を付けて書かないと、スタイルが適用されずに地味にハマることになるので注意したい。
この優先順位のところは慣れてないと上手くいかないことが多い（経験談）。

以上