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