1.选择第一个元素 :nth-child(1) { } 2.选择最后一个元素 :nth-last-child(1) { } 3.选择偶数元素 :nth-child(even) { } 4.选择奇数元素 :nth-child(odd) { } 二、数学表达式选择 1.每隔3个选择一个 :nth-child(3n) { } 2.选择前3个元素 :nth-child(-n+3) { } 3.从第3个开始选择 ...
1.表格隔行变色 2.列表最后三个元素特殊样式 3.首行缩进特殊处理 4.除了第一行的元素都加上上边框 一、基础选择 1.选择第一个元素 :nth-child(1) { } 2.选择最后一个元素 :nth-last-child(1) { } 3.选择偶数元素 :nth-child(even) { } 4.选择奇数元素 :nth-child(odd) { } 二、数学表达式选...
1、first-child first-child表示选择列表中的第一个标签。代码如下: li:first-child{background:#090} 上面的意思是,li 列表中的 第一个li模块的背景颜色。 2、last-child last-child表示选择列表中的最后一个标签,代码如下: li:last-child{background:#090} 3、nth-child(3) 表示选择列表中的第3个标签,...
热衷技术，在编程路上越走越远～ 知识运用： 条件类型的使用：文档地址 infer关键字也参照条件类型使用...
1、first-child first-child表示选择列表中的第一个标签。代码如下: li:first-child{background:#090} 上面的意思是,li 列表中的 第一个li模块的背景颜色。 2、last-child last-child表示选择列表中的最后一个标签,代码如下: li:last-child{background:#090} ...
/* 选择第n个,n位数字 */ :nth-child(n) 选择列表中的偶数标签 :nth-child(2n) 选择列表中的奇数标签 :nth-child(2n-1) 选择前几个元素 /*【负方向范围】选择第1个到第6个 */ :nth-child(-n+6){} 从第几个开始选择 /*【正方向范围】选择从第6个开始的,直到最后 */ :nth-child(n+6){}...
1、first-child first-child表示选择列表中的第一个标签。代码如下：li:first-child{background:#090} 上面的意思是，li 列表中的 第一个li模块的背景颜色。2、last-child last-child表示选择列表中的最后一个标签，代码如下：li:last-child{background:#090} 3、nth-child(3)表示选择列表中的第3个标签，代码...
:nth-child(-n+3){ margin-top: 12px; } 2.选择前几个元素 /*【负方向范围】选择第1个到第6个 */ :nth-child(-n+6){} 3.从第几个开始选择 /*【正方向范围】选择从第6个开始的 */ :nth-child(n+6){} 4.两者结合使用,可以限制选择某一个范围 ...
:nth-last-child() 选择器 :nth-last-child(n) 选择器匹配属于其元素的第 N 个子元素的每个元素,不论元素的类型,从最后一个子元素开始计数。 n 可以是数字、关键词或公式。 提示:请参阅 :nth-last-of-type() 选择器,该选择器选取父元素的第 N 个指定类型的子元素,从最后一个子元素开始计数。
:nth-child(an)---匹配所有倍数为a的元素。其中参数an中的字母n不能缺省。 :nth-child(an+b) |:nth-child(an-b)---倍数分组匹配,其中a,b均为正整数或0, 举例:li:nth-child(4n+1){color:green;} 或者是4n-7 :nth-child(-an+b)反向倍数分组匹配 ---从第b个开始往回算,最多也不会超过b个。