【CSS】:only-child（擬似クラス） - １つのみの要素

CSSの擬似クラスの１つ、only-childについてご紹介します。

only-child

擬似クラスonly-childは兄弟要素がない１つのみの要素です。

基本構文

:only-child {
    プロパティ名: プロパティ値;
}

サンプル

次のサンプルコードは『liかつが兄弟要素がない要素』にスタイルを適用しています。

sample

<style>
li:only-child {
    color: red;
}
</style>

<ul>
    <li>Command</li>
</ul>
<hr>
<ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
</ul>

プレビュー