1. 程式人生 > >CSS3偽類 :empty

CSS3偽類 :empty

css3.0 css htm cnblogs font 宋體 tex 選擇器 text

:empty

種類:偽類選擇器

版本:CSS3.0

用法:匹配每個沒有子元素(包含文本)的元素。

例子:

<!DOCTYPE html>
<html>
<head>
    <title>test008_偽類選擇器empty</title>
    <style type="text/css">
        div{
            width: 100px;
            height: 100px;
            background-color: white;
        }
div:empty{ background-color: red; } </style> </head> <body> <div><p></p></div> <div>hello world</div> <div> </div> <div></div> </body>
</html>

在這個例子裏,一共有四個div。

結果,只有第四個div背景為紅色。

第一個和第二個div有內容,不用說。

第三個div有空格,也屬於內容,所以也不在empty的選擇範圍內。

CSS3偽類 :empty