artikel:nth-last-child(odd) { display: -webkit-flex; /* Safari */ -webkit-flex-direction: row-reverse; /* Safari 6.1+ */ display: flex; flex-direction: row-reverse; flex-wrap: wrap; } Now i'm no wiz at php nor css, so the code might not be precisely as it ought to be, ...
:nth-child :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。 语法element:nth-child(an + b) { /*规则*/ }值值描述 :nth-child(2n+1) 规定奇数行。 nth-child(odd) 规定奇数行。 nth-child(2n) 规定偶数行。 nth-child(even) 规定偶数行。 :nth-child(0n+1) 规定子...
我想选择第一个 child ,但我有这样的 CSS #container #content:nth-child(odd) .arrow { background: red; } #container #content:nth-child(even) .arrow { background: green; } #container #content:first-child .arrow { background: pink; } 但是第一个 child 是红色的,因为第一个 child 是奇数。
:nth-child(2n-1)选取奇数标签,2n-1可以是odd 点此查看实例展示 .demo01 li:nth-child(2n-1){background:#090} :nth-child(3n+1)自定义选取标签,3n+1表示“隔二取一” 点此查看实例展示 .demo01 li:nth-child(3n+1){background:#090} :last-child选取最后一个标签 点此查看实例展示 .demo01 li:...
nth-child(2){};代码如下ul li:nth-child(2){background-color:aqua;color:red;},浏览器中查看效果,如图所示 6 剩下的设置方法相同,child后面的数字是几,就代表是第几个选块,然后分别设置背景颜色和字体颜色,效果如图所示。注意事项 如果此经验对您有帮助,请左侧点赞关注,谢谢大家的支持^_^ ...
li:nth-child(-1n+8){background:orange;}/*或(-n+8),匹配前8个(包括第8个)LI,这个较为实用点,用来限定前面N个匹配常会用到*/第五种:奇偶匹配:nth-child(odd) 与 :nth-child(even)分别匹配序号为奇数与偶数的元素。奇数(odd)与(2n+1)结果一样;偶数(even)与(2n+0)及(2n)结果一样。同时这个伪...
在上面的示例中,通过使用nth-child(odd)选择器,我们选择了奇数位置的DIV,并将其背景颜色设置为lightgray。这样,第一个、第三、第五个DIV将具有不同的背景颜色。 对于HTML/CSS的学习和实践,可以参考腾讯云的云开发文档和教程,以了解更多关于HTML/CSS的知识和应用场景。 腾讯云相关产品和产品介绍链接地址: 云开发文档...
一、:first-child、:last-child、:nth-child(n)、:only-child 子元素伪类选择器(第1类) 选择器 说明 E:first-child 选择父元素下的第一个子元素(该子元素类型为E,以下类同) E:last-child 选择父元素下的最后一个子元素 E:nth-child(n) 选择父元素下的第n个子元素或奇偶元素,n取值有3种:数字、odd和...
/* ul li:nth-child(even) { background-color: pink; } ul li:nth-child(odd) { background-color: hotpink; } */ /* n 是公式 但是 n 从0开始计算 */ /* ul li:nth-child(n) { background-color: pink; } */ /* 2n 偶数 类似于 even */ ...
方法/步骤 1 首先打开编辑器新建一个HMTL文件 2 输入基础代码(小编使用ul标签做为演示)3 编写CSS选择【基数行】并添加样式核心代码:.list > li:nth-child(odd){ background: blue; font-size: 18px; color: #fff;} 4 编写CSS选择【偶数行】并添加样式核心代码:.list > li:nth-child(even){ back...