<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* 选中所有li元素，如果这个li元素是父元素中的第一个li类型的子元素 就匹配成功 */
/* li:first-of-type{
color: red;
} */
/* 选中所有span元素，如果这个span元素是父元素中的最后一个span类型的子元素 就匹配成功 */
/* span:last-of-type{
color: blue;
font-weight: bold;
} */
/* 选中所有p元素，如果这个p元素是父元素中的顺数第二个p类型的子元素 就匹配成功 */
/* p:nth-of-type(2){
color: green;
} */
/* 选择父元素中为2 */
p:nth-of-type(2n){
color: yellow;
font-weight: bolder;
}
</style>
</head>
<body>
<div>div1111111111111111</div>
<li>li11111111111111</li>
<li>li22222222222222222222</li>
<li>li333333333333333333333333333333</li>
<div>
<div>div2222222222222222222222222222222</div>
<p>p11111111111111111111111</p>
<p>p22222222222222222222222222222</p>
<div>div3333333333333333333</div>
<span>span11111111111111111111111</span>
<div>
<p>p3333333333333333333333333333333333333333333333</p>
<span>span2222222222222222222222222</span>
<p>p4444444444444444444444444</p>
<span>span33333333333333333333333333333333333</span>
<li>li5555555555555555555555555555555555555</li>
</div>
</div>
<p>p5555555555555555555</p>
</body>
</html>
65
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
