CSS 新增結(jié)購性偽類 7~9
7.:nth-last-child(n)
使用:nth-last-child(n)選擇器匹配屬于父元素的第N個(gè)子元素的每個(gè)元素，不論元素的類型，從最后一"t'子元素開始計(jì)數(shù)，n可以是數(shù)字、關(guān)鍵詞或公式。
8.:only-child
使用:only-child選擇器匹配屬于父元素的唯一子元素的每個(gè)元素。
【例題】使用:only-child選擇器
代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
p:only-child{
color:red;
}
li:only-child{
color:green;
}
</style>
</head>
<body>
<div>
<p>items0</p>
</div>
<ul>
<li>items1</li>
<li>items2</li>
<li>items3</li>
<li>items4</li>
<span>items5</span>
</ul>
</body>
</html>
雖然分別對p和span元素設(shè)置了文本顏色屬性，但是只有p元素有效，因?yàn)閜元素是div下的唯一子元素。
9.:only-of—type
使用:only-of-type選擇器匹配屬于父元素的特定類型的唯一子元素的每個(gè)元素。
【例題】使用:only-of-type選擇器
代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
p:only-of-type{
color:red;
}
span:only-of-type{
color:green;
}
</style>
</head>
<body>
<div>
<p>items0</p>
</div>
<ul>
<li>items1</li>
<li>items2</li>
<li>items3</li>
<li>items4</li>
<span>items5</span>
</ul>
</body>
</html>
湘公網(wǎng)安備:43011102000856號 
點(diǎn)擊加載更多評論>>