首先我們來了解一下:empty是什麼？有什麼作用？
:empty是一個css的僞類選擇器，用于選擇頁面中為空的元素。
如果元素沒有任何子元素(節點)或文本内容，則該元素計為空。注釋和處理指令不會影響元素是否為空。如：
會被認為是空的，進而被:empty選中，而：
文本和子節點。
這裡有一些内容。
在這打字。
則不會被認為是空，是以與選擇器不比對。
選擇空元素對于隐藏這些元素很有用，因為如果它們有填充，它們可能是奇怪的垂直和/或水準空白區域的原因。它對于在不再需要或有用空元素的動态環境中删除空元素也很有用。例：
*：empty{
display：none;
}
p：empty{
display：none;
}
nava：empty{
display：none;
}
td：empty{
background-color：#eee;
}
說明：
1、由僞元素::before，::after生成的内容并不算作“真實”内容，即使它們存在于元素内部，也不會影響元素之間的空白。
2、元素内的空格和空子元素計為該元素内的字元資訊，是以如果元素包含兩個元素中的一個，則該元素不再被視為空。例如，以下兩個元素不被視為空：
3、由于空格被視為内容，是以打開但未關閉的元素标記也不會為空。例如：
4、如果開始标記後面緊跟另一個标記，則它再次被視為空。
内容......
5、如果一個開放标記後跟另一個未直接跟随另一個标記的開放标記，則第一個标記被認為是空的，而第二個标記則不是(因為空白)。例如：
6、自閉合元件，例如
，
，和等都會被認為是空的，并且将和:empty選擇器比對。
下面我們通過簡單的示例來看看:empty的使用：
示例示範：把亞麻色背景應用于空段落
html代碼：
測試，測試，測試，測試，測試，測試，測試，測試，測試。
測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試，測試！