[CSS3] :empty Selector

When the element has empty content, you might want to display some text to idicate the compoent is loading...

 

<!DOCTYPE html>
<html>
<head>
<style> 
p:empty {
    width: 100px;
    height: 20px;
    background: #ff0000;
}
p:empty:after {
    content: "Loading..., please wait"
}
</style>
</head>
<body>

<p></p>
<p>A paragraph.</p>
<p>Another paragraph.</p>

</body>
</html>

 

posted @ 2018-05-21 16:15  Zhentiw  阅读(144)  评论(0)  编辑  收藏  举报