ul:nth-child(2) >li:nth-child(1) {
    css代码段
}

默认 一个页面有多个 ul

ul:nth-child(2) 默认为所有同类型页面第二个

li:nth-child(1) 默认为继 ul:nth-child(2) 之后所有列表第一条的样式表属性

测试代码段

<style> 
	ul{display:inline}
	/**第二个ul下第一个li字体为红色**/
	ul:nth-child(2) >li:nth-child(1) {
    	color: red;
	}
</style>
<ul>
	<li>aaaaaaaaaaa</li>
	<li>bbbbbbbbbbb</li>
	<li>ccccccccccc</li>
</ul>

<ul>
	<li>eeeeeeeeeee</li>
	<li>fffffffffff</li>
	<li>ggggggggggg</li>
</ul>

<ul>
	<li>hhhhhhhhhhh</li>
	<li>iiiiiiiiiii</li>
	<li>jjjjjjjjjjj</li>
</ul>

这种选择器叠加在很多新闻列表页的时候会用到

发表评论

共有 0 条评论