<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
.liu:last-of-type {
color: red;
}
//在此案例中,last-child也是同样的效果
.liu:last-child {
color: red;
}
</style>
</head>
<body>
<ul>
<li class="liu">1</li>
<li class="liu">2</li>
<li>3</li>
</ul>
</body>
</html>
页面效果是
为什么会这样?
给最后一个li标签加上类名后就有效果!
<li class="liu">1</li>
<li class="liu">2</li>
<li class="liu">3</li>
这个问题值得注意!
