Home > Article > Web Front-end > What is empty selector? Detailed explanation of empty selector
What is empty selector? Detailed explanation of empty selector
- 云罗郡主forward
- 2018-11-19 10:41:193016browse
This article brings you the content about what is the empty selector? The detailed explanation of the empty selector has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
In CSS3, the :empty selector is used to select an element that does not contain any child elements or content. That is, select an element with blank content.
Example:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS3 :empty选择器</title>
<style type="text/css">
table,tr,td
{
border:1px solid silver;
}
td
{
width:60px;
height:60px;
line-height:60px;
text-align:center;
background-color: #FFA722;
}
td:empty
{
background-color:red;
}
</style>
</head>
<body>
<table>
<tr>
<td>2</td>
<td>4</td>
<td>8</td>
</tr>
<tr>
<td>16</td>
<td>32</td>
<td>64</td>
</tr>
<tr>
<td>128</td>
<td>256</td>
<td></td>
</tr>
</table>
</body>
</html>The effect is as follows:
Analysis:
In the web form, the content is empty Cells are often set to different colors to make the user experience better. The web version of the HTML5 game 2048 also uses the empty selector technology.
The above is the explanation of what is the empty selector? A complete introduction to the detailed explanation of the empty selector. If you want to know more about CSS3 tutorial, please pay attention to the PHP Chinese website.
The above is the detailed content of What is empty selector? Detailed explanation of empty selector. For more information, please follow other related articles on the PHP Chinese website!