「CSS」:emptyで中身が空の要素にCSSを適用する方法
構文
要素 :empty
説明
:empty は CSS の 擬似クラスで、子を持たない要素を表します。子とは要素のノード または文字列 (ホワイトスペースを含む) です。
CSSコード
.cft {
background: green;
height: 60px;
width: 70px;
}
/* 内容を含まない <div> 要素を選択 */
.cft:empty {
background: blue;
}
.cft {
background: green;
height: 60px;
width: 70px;
}
/* 内容を含まない <div> 要素を選択 */
.cft:empty {
background: blue;
}
.cft {
background: green;
height: 60px;
width: 70px;
}
/* 内容を含まない <div> 要素を選択 */
.cft:empty {
background: blue;
}
htmlコード
/* 中身が空のためCSSが適用*/
<div class="cft"></div>
<div class="cft">green 表示</div>
/* コメントの場合emptyのcssが適用*/
<div class="cft"><!– blue表示. –></div>