用last-child 和nth-last-child等偽類時,HTML父容器內不能有其他元素,否則不會生效
下面是正確的寫法
<style>
li.heading:last-child {
background: black;
}
li.heading:nth-child(2) {
background: black;
}
</style>
</head>
<body>
<ul>
<li class="heading">Hello world</li>
<li class="heading">Hello world</li>
<li class="heading">Hello world</li>
<li class="heading">Hello world</li>
<li class="heading">Hello world</li>
</ul>
下面是錯誤的寫法
<!DOCTYPE html>
<html>
<head>
<style>
.dd:last-child
{
background:#ff0000;
}
</style>
</head>
<body>
<h1>這是標題</h1>
<p class="dd">第一個段落衩婚。</p>
<p class="dd">第二個段落剔应。</p>
<p>第三個段落咒林。</p>
<p>第四個段落熬拒。</p>
<p>第五個段落。</p>
</body>
</html>