CSS 参考マニュアル

CSS @ルール(RULES)

CSS 属性全書

CSS3 :only-child 選択子

CSSの:only-child は兄弟がいらない要素に一致します。:first相当の選択子も書ける-child:last-childまたは:nth-child(1:nth-last-child(1),もちろん、前者の重みは少し低くなります。

完全なCSS選択子リファレンスマニュアル

オンラインサンプル

親要素の中でユニークな子要素である p 要素に一致します:

例

!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title>基本トレーニング(oldtoolbag.com)</title>
<style>
div　p:only-child　{
　　color: red;
}
</style>
</head>
<body>
<div>
　　<p>この段落はその親要素のユニークな子要素です</p>
</div>
<div>
<p>この段落はその親要素の一番目の子要素です</p>
<p>この段落はその親要素の二番目の子要素です</p>
</div>
</body>
</html>

試してみる ‹/›

定義と使用法

:only-child

:only-child 選択子は、親要素の中でユニークな子要素である要素に一致します。

ブラウザの互換性

テーブルの数字は、その属性をサポートする最初のブラウザのバージョン番号を示しています。

選択子
:only-child	4.0	9.0	3.5	3.2	9.6

完全なCSS選択子リファレンスマニュアル

CSS関数（Functions）CSSセレクタ全書