这两个都是css3选择器,odd是奇数行,even是偶数行。 ul li:nth-child(odd){ background-color: lightgreen; } 以上样式表示奇数行的li背景色为浅绿色。
一个记住的好方法: odd是3个字母,单数,所以表示奇数 even是4个字母,所以表示偶数
方法/步骤 1 新建一个html文件，命名为test.html，用于讲解css如何利用奇偶数进行样式定义。2 在test.html文件中，使用a标签创建多个数字，用于测试。3 在css样式表内，使用nth-child选择器对偶数（even）位置的数字进行样式定义，例如，这里设置文字颜色为红色。4 在css样式表内，使用nth-child选择器对奇数（odd）...
nth-child(odd) 选择奇数行 nth-child(even) 选择偶数行 还有其他的书写方式，也可以使用 nth-...
nth-child(odd):奇数 nth-child(even):偶数 使用时,如果是精确到数字时,切记是从同一级别的元素开始计算,而不是指定某个类才开始计算。 比如: 如果我要选择class为test的,nth-child(2),第2个。 详细解释,参考: http://niutuku.com/tech/css/249737...
要选择最后两个元素,可以使用:nth-last-child(-n+x)选择器。其中n表示元素总数,x表示最后几个元素的个数。 要选择奇数个元素,可以使用:nth-child(odd)选择器。 要选择偶数个元素,可以使用:nth-child(even)选择器。 综合起来,以下三个选择器可以分别选择最后两个元素、奇数个元素和偶数个元素: ...
方式一:nth-child div:nth-child(odd){ }//奇数行 div:nth-child(even){ }//偶数行 :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。 方式二:nth-of-type div:nth-of-type(odd){//奇数行}div:nth-of-type(even){//偶数行} ...
li:nth-child(odd){ background: #999; } 我们可以通过另外的方法选择奇数行,例如: nth-child(2n+1) 、 nth-child(2n-1) 等。 代码如下: /*First*/ li:nth-child(2n+1){ background: #999; } /*Second*/ li:nth-child(2n-1){ background: #999; ...
代码里odd和even是定义单双行的样式,其中odd是单行,而even是双行。 实例 完整HTML代码 <!doctype html> CSS实现table表格tr单双行颜色相间而不同 table.dataintable { margin-top:15px; border-collapse:collapse; border:1px solid #aaa; width...
1.2、nth-child(odd) 父元素下的奇数子元素 等同于 nth-child(2n-1)div p:nth-child(odd){background: skyblue;} 1.3、nth-child(even) 父元素下的偶数子元素 同样区分子元素类型 等同于nth-child(2n)div p:nth-child(even){background: skyblue;} 二、nth-of-type 匹配属于...