CSS：nth-child、first-child、last-child

选择列表中的第一个标签first-child

li:first-child{background:#090}

选择列表中的最后一个标签last-child

li:last-child{background:#090}

选择列表中的第n个标签nth-child(n)

li:nth-child(3){background:#090}

根据条件选择标签nth-child(表达式)

nth-child(2n) :选择列表中的偶数标签，即选择第2、第4、第6…… 标签。
nth-child(2n-1):选择列表中的奇数标签，即选择第1、第3、第5、第7……标签。
nth-child(n+3):选择列表中的标签从第3个开始到最后。
nth-child(-n+3):选择列表中的标签从0到3，即小于3的标签。
nth-last-child(3):选择列表中的倒数第3个标签。

CSS：nth-child、first-child、last-child相关推荐

css：图像与文字（对齐、字间距、行间距、阴影）
图像与文字对齐方式第一种:text-align:center: (水平居中对齐) 第二种:vertical-align:text-top/text-bottom/middle:(垂直顶端对齐.底部对 ...
Jquery从入门到精通：二、选择器 2、选择器（1）CSS选择器
1.准备知识:CSS选择器:(参考文档:CSS2.0帮助文档) 代码: <body> <div> <p id="p1">足不出户订窗帘:< ...
一天搞定CSS：盒模型content、padding、border、margin--06
1.盒模型网页设计中常听的属性名:内容(content).填充(padding).边框(border).边界(margin), CSS盒子模式都具备这些属性.这些属性我们可以用日常生活中的常见事物- ...
从零开始学前端：HTML的一些文本格式化标签、快捷键、和特殊符号 --- 今天你学习了吗？（CSS：Day02）
从零开始学前端:程序猿小白也可以完全掌握!- 今天你学习了吗?(CSS) 复习:从零开始学前端: HTML框架和VS Code安装 - 今天你学习了吗?(CSS:Day01) 文章目录从零开始学前端 ...
分别实现：css动画、js动画、vue动画
一.使用css3实现动画 css3动画的核心是定义transition或 keyframes 两种. keyframes:设置多个关键帧来控控制不懂时间下动画对象属性的值,(可循环的) transit ...
翻译：《Pro CSS and HTML Design Patterns》简介、总览和目录
Apress, Pro CSS and HTML Design Patterns, Apr. 2007 <CSS与HTML高级设计模式> 简介: 设计模式在软件编程领域取得了巨大成功.在w ...
W3school：CSS基础：CSS注释、颜色（颜色、RGB、HEX、HSL）、背景（背景、背景图像、背景重复、背景附着、简写背景属性）
W3school:CSS基础:CSS注释.颜色(颜色.RGB.HEX.HSL).背景(背景.背景图像.背景重复.背景附着.简写背景属性) 一.CSS注释 1.注释用于解释代码,以后在您编辑源代码时可能 ...
css复合选择器（后代选择器、子代选择器、并集选择器、链接伪类选择器、：focus选择器）
什么是复合选择器? 在css中,可以根据选择器的类型把选择器分为基础选择器和复合选择器,复合选择器是建立在基础选择器之上,对基本选择器进行组合形成的. 复合选择器可以更准确.更高效的选择目标元素(标签 ...
WEB安全之DIV CSS基础（二）：文字和文本的属性、列表样式和伪类超链接
WEB安全之DIV CSS基础(二):文字和文本的属性.列表样式和伪类超链接) 文字和文本的属性文字属性文本属性列表样式和伪类超链接项目符号列举设置列表项标记超链接文字和文本的属性文字 ...
CSS：使用线性渐变实现标签右上角三角形角标效果/HTML上标、下标
需求描述想要实现标签右上角带有三角形角标的效果,且不希望使用图标或新建div实现角标效果,效果如图: 实现思路可以将标签右上角的三角形角标理解为与主体颜色不同的背景色,由此想到:可以使用线性渐变实 ...

CSS：nth-child、first-child、last-child

选择列表中的第一个标签first-child

选择列表中的最后一个标签last-child

选择列表中的第n个标签nth-child(n)

根据条件选择标签nth-child(表达式)

CSS：nth-child、first-child、last-child相关推荐

最新文章

热门文章