リストの最初の要素にスタイルを適用したい場合は「:first-child疑似クラス」を使用します。
例えば、定義リストの1番目のみ太字にしたい時などに使えます。
サンプルソース
例)定義リストの1番目のみ背景色を黄色にする
1 2 3 4 |
/* 1番目のスタイル */ ul li:first-child{ background-color:yellow; } |
1 2 3 4 5 |
<ul> <li>ペット</li> <li>いぬ</li> <li>ねこ</li> </ul> |
【結果】
- ペット
- いぬ
- ねこ
メモ
- リスト以外にも、テーブルのtdタグなどにも使用できます。
- 一番最後の要素にスタイルを指定したい場合は、:last-child疑似クラスを使用します。
コメント