【CSS】:last-child(擬似クラス) - 最後の要素
CSSの擬似クラスの1つ、last-childについてご紹介します。
last-child
擬似クラスlast-child
は兄弟要素の最後の要素です。
基本構文
:last-child {
プロパティ名: プロパティ値;
}
サンプル
次のサンプルコードは『pかつ最後の要素』にスタイルを適用します。
<style>
p:last-child {
color: red;
}
</style>
<section>
<h2>セレクター</h2>
<p>セレクターは『スタイルを適用する要素』です。</p>
<h2>プロパティ名</h2>
<p>プロパティ名は『スタイルの種類』です。</p>
<h2>プロパティ値</h2>
<p>プロパティ値は『スタイルの値』です。</p>
</section>
スタイルのpをh2に変更すると『h2かつ最後の要素』は存在しないため、適用される要素はありません。
h2:last-child {
color: red;
}