このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。

使えるcss3セレクタシリーズ 今回はonly-child()

唯一の子要素を指定する事が可能です。

HTML

<div id="test">
<div>divの要素</div>
</div>

CSS

div#test > div:only-child{
color:#f00;
}

HTML

<div id="test">
<div>divの要素</div>
<p>pの要素</p>
</div>

pタグ等を含めると

またdiv要素を含め、兄弟関係があると

HTML

<div id="test">
<div>divの要素</div>
<div>divの要素</div>
</div>

この様に適応されません。