読者です 読者をやめる 読者になる 読者になる

思考停止するな

ネットワークとかアプリケーションとかWebとか

CSS セレクタについて

スポンサーリンク

CSS セレクタについてです。

セレクタの書き方にはいくつか種類がある。

シンプルセレクタ
要素のみ、classのみ、idのみのように単一に使用するセレクタ

h1{color:red;}
#aaa{color:red;}
.aaa{color:red;}

グループセレクタ
複数のセレクタをカンマでつなぐことで、まとめて指定することができるセレクタ

h1,h2,h3{color:red;}

子孫セレクタ
親→子→孫のように絞り込む形で指定するセレクタ

<div id = "aaa">
  <ul>
    <li>てすと</li>
  </ul>
</div>
#aaa ul li{color:red;}

セレクタ
親要素と子要素の間を「>」で繋いで特定の親の特定の要素といったように直接指定するセレクタ

<ul id = "aaa">
  <li>てすと</li>
</ul>
#aaa > li{color:red;}

隣接セレクタ
指定した要素の次に続く要素を「+」でつなぐセレクタ
以下の例ではh1の次のp要素。

<h1>あああ</h1>
<p>いいい</p>
h1 + p2 {color:red;}