【CSS Modules】:last-child疑似クラスの使い方

:last-childクラスは、親要素内の直下にある全ての子要素の中で、最後に位置する要素を表すクラスです。この擬似クラスは、要素のタイプ（タグ名）に関わらず、HTMLのマークアップ上で物理的に最後に配置されている子要素を特定するために使用されます。例えば、複数のリストアイテム（<li>）が並ぶ<ul>要素の中で、最後の<li>要素のみに特別なスタイルを適用したい場合に便利です。

具体的な使用例としては、一連のカードやリストの末尾要素に下線やマージンを適用しない、あるいは背景色を変更するなど、見た目を調整する際に利用されます。これにより、ユーザーインターフェース（UI）の統一感を保ちつつ、特定の要素に対してのみ個別なデザインを適用することが可能です。:last-childを使用する際は、対象となる要素が親要素の最後の子要素として正しくマークアップされていることが重要です。このセレクターは、要素の順序に基づいたスタイリングを簡潔かつ効率的に記述するための強力なツールとなります。

Copy
1p:last-child {
2  color: blue;
3  font-weight: bold;
4}

引数なし

引数はありません

戻り値なし

戻り値はありません