CSS选取第n个标签元素
最近做一个项目,碰到这样的需求,需要选取某个元素的倒数第几个标签元素,想让他显示不同的样式
1、first-child
first-child表示选择列表中的第一个标签。例如:li:first-child{background:#fff}
2、last-child
last-child表示选择列表中的最后一个标签,例如:li:last-child{background:#fff}
3、nth-child(3)
表示选择列表中的第3个标签,例如:li:nth-child(3){background:#fff},代码中的3也可以改成其它数字,如4、5等。想选择第几个标签,就填写几。
4、nth-child(2n)
这个表示选择列表中的偶数标签,即选择 第2、第4、第6…… 标签,例如:li:nth-child(2n){background:#fff}
5、nth-child(2n-1)
这个表示选择列表中的奇数标签,即选择 第1、第3、第5、第7……标签,例如:li:nth-child(2n-1){background:#fff}
6、nth-child(n+3)
这个表示选择列表中的标签从第3个开始到最后。
7、nth-child(-n+3)
这个表示选择列表中的标签从0到3,即小于3的标签。
8、nth-last-child(3)
这个表示选择列表中的倒数第3个标签。
CSS选取第n个标签元素的更多相关文章
- 7.15 css与js 选择奇偶子元素的区别
js: 选取偶数位置的 <tr> 元素 $("tr:even") 选取奇数位置的 <tr> 元素 $("tr:odd") css 选取偶 ...
- CSS html标签元素分类
在CSS中,html中的标签元素大体被分为三种不同的类型: 块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1>… ...
- CSS中html的标签元素分类
在CSS中,html中的标签元素大体被分为三种不同的类型: 块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ...
- 关于css中伪类及伪元素的总结
css中的伪类和伪元素总是混淆,今天参考了很多资料,也查看了部分文档,现将伪类及伪元素总结如下: 一.由来: 伪类和伪元素的引入都是因为在文档树里有些信息无法被充分描述,比如CSS没有"段落 ...
- CSS中伪类及伪元素用法详解
CSS中伪类及伪元素用法详解 伪类的分类及作用: 注:该表引自W3School教程 伪元素的分类及作用: 接下来让博主通过一些生动的实例(之前的作业或小作品)来说明几种常用伪类的用法和效果,其他的 ...
- 常用HTML标签元素结合及简介
常用HTML标签元素结合及简介 <html></html> 创建一个HTML文档<head></head> 设置文档标题和其它在网页中不显示的信息< ...
- HTML+CSS学习笔记(2) - 认识标签(1)
HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 标签的用途: 我们学习网页制作时,常常会听到一个词,语义化.那么什么叫做语义化呢,说的通俗点就是:明白每 ...
- CSS+DIV布局初练—DIV元素必须成对出现?
一直做C/S开发的工作,但是很少做和布局相关的工作,往往都是同事将界面设计好,自己填写代码而已,对于B/S的工作,做过,但是很少没有像C/S这么多,界面布局的话,更无从谈起. 日子就这么过,一天一个样 ...
- HTML标签元素分类(HTML基础知识)
HTML标签元素分类 一.按照块级元素还是行内元素分类 块级元素(block-level)和行内元素(inline-level,也叫作"内联"元素). a.块级元素(独占一行) 块 ...
随机推荐
- JavaScript向select下拉框中添加和删除元素
JavaScript向select下拉框中添加和删除元素 1.说明 a 利用append()方法向下拉框中添加元素 b 利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...
- ASP.NET Core轻松入门之Middleware管道模型
Middleware指的是微软的的asp.net core的管道模型.其原理可以用微软官方的下图展示: 原理如上图,随着Request的发起,HttpContext会经历多个管道处理(图中的箭头游走方 ...
- order调用mdp
Java代码 else { crmMessageService[A1] .applyAsync(crmMdpRequest); } public v ...
- java查看程序执行时间
public static void main(String[] args) { long a= System.currentTimeMillis();//获取当前系统时间(毫秒) for (int ...
- Linux压缩、解压文件
对于.tar格式的文件压缩和解压比较常用,今天对于.zip格式的文件用同样的命令无效.真是被自己蠢到了,忽略了后缀格式... 1.对于tar格式文件 压缩: tar –zcvf 压缩完后的名称 被压 ...
- 【ASP.NET Core】根据 Content-Type 头部来筛选 Action
在开始今天的吹牛节目之前,老周先说个破事:每周的周五或者周六,老周会在新浪直播平台(一直播同步)开播 ASP.NET Core 相关的内容.具体的直播时间老周会在微博上发布.直播是免费观看的,当然了, ...
- 在linux上安装dotnetcore
dotnet core已经出来有一段时间了,不是什么新名词了.但这个技术,目前还是比较新的,企业也没有普遍应用.它最大的亮点就是跨平台,也就是我们写的c#代码,可以运行在linux上. 在国内学习do ...
- Java 多线程之哪个对象才是锁?
问题背景 在感觉正常的使用ArrayList的迭代删除的操作的时候,发现了如下的崩溃日志: Caused by: java.util.ConcurrentModificationException a ...
- 'net’ 不是内部命令或外部命令,也不是可运行的程序或批处理文件
我的电脑-->属性-->高级-->环境变量 path的变量值新加: %SystemRoot%\system32 修改完成后,需要重新打开cmd命令行,否则不会生效的.
- Java 对IP请求进行限流.
高并发系统下, 有三把利器 缓存 降级 限流. 缓存: 将常用数据缓存起来, 减少数据库或者磁盘IO 降级: 保护核心系统, 降低非核心业务请求响应 限流: 在某一个时间窗口内对请求进行限速, 保护系 ...