css3 :nth-child 常用用法
前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”。
下面我将用几个典型的实例来给大家讲解:nth-child的实际用途:
Tips:还用低版本的IE浏览器的哥们请绕过!
:nth-child(2)选取第几个标签,“2可以是你想要的数字”
.demo01 li:nth-child(2){background:#090}
:nth-child(n+4)选取大于等于4标签,“n”表示从整数,下同
.demo01 li:nth-child(n+4){background:#090}
:nth-child(-n+4)选取小于等于4标签
.demo01 li:nth-child(-n+4){background:#090}
:nth-child(2n)选取偶数标签,2n也可以是even
.demo01 li:nth-child(2n){background:#090}
: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:last-child{background:#090}
:nth-last-child(3)选取倒数第几个标签,3表示选取第3个
css3 :nth-child 常用用法的更多相关文章
- iptables-25个常用用法【转】
本文介绍25个常用的iptables用法.如果你对iptables还不甚了解,可以参考上一篇iptables详细教程:基础.架构.清空规则.追加规则.应用实例,看完这篇文章,你就能明白iptables ...
- 前端CSS3布局display:grid用法
前端CSS3布局display:flex用法 1. 先附上代码 点击查看代码 <!DOCTYPE html> <html> <head> <meta char ...
- 前端CSS3布局display:flex用法
前端CSS3布局display:flex用法 先附上代码 点击查看代码 <!DOCTYPE html> <html> <head> <meta charset ...
- centos的vi常用用法
centos的vi常用用法 vi编辑器是所有Unix及Linux系统下标准的编辑器,它的强大不逊色于任何最新的文本编辑器,这里只是简单地介绍一下它的用法和一小部分指令.由于对Unix及Linux系统的 ...
- MySql与SqlServer的一些常用用法的差别
MySql与SqlServer的一些常用用法的差别 本文为转载 本文将主要列出MySql与SqlServer不同的地方,且以常用的存储过程的相关内容为主. 1. 标识符限定符 SqlServer [] ...
- [转]ssh常用用法小结
ssh常用用法小结 1.连接到远程主机: 命令格式 : ssh name@remoteserver 或者 ssh remoteserver -l name 说明:以上两种方式都可以远程登录到远程主机, ...
- 【三支火把】---一份程序看懂C程序printf()的几种常用用法
闲来继续巩固我的学习之路,今天略微整理了一下,C程序中Printf()的一些常用用法,虽然自己以前好像会,但是不够系统,今天大致整理了一些,先贴上来看看,以后在看到其他,继续补充,希望能帮到一些像我一 ...
- grep参数说明及常用用法
grep参数说明及常用用法 趁着午休的时间把自己经常使用的一些grep命令整理一下. 方便以后查看. 后续会逐步把awk/sed/find等常用的命令理一理. 增强下记忆. 也算是对得起自己了. ^^ ...
- ssh常用用法小结
ssh常用用法小结 1.连接到远程主机: 命令格式 : ssh name@remoteserver 或者 ssh remoteserver -l name 说明:以上两种方式都可以远程登录到远程主机, ...
- C# Linq基本常用用法
1.什么是Linq? Lanaguage Interated Query(语言集成查询),Linq 是集成C# 和VB这些语言中用于提供数据查询能力的一个新特性. 这里只介绍两种基本常用用法. 学习方 ...
随机推荐
- Win7 _Object_header 中的 TypeIndex
Win7 比较 xp下ObjectHeader中的内容有所变化,xp直接在OBJECT_HEADER里保存了POBJECT_TYPE指针,而Win7中把所有的对象类型放在了一个表里,这个表叫做ObTy ...
- C#加密算法汇总
方法一: //须添加对System.Web的引用 using System.Web.Security; ... /// <summary> /// SHA1加密字符串 /// </s ...
- C语言学习资料(转载)
◆经典C源程序100例:http://post.baidu.com/f?kz=8618367 ◆时钟的驻留程序:http://post.baidu.com/f?kz=10822377 ◆数据结构暨若干 ...
- 【PSR规范专题(2)】PSR-1 基本代码规范
转载自: https://github.com/PizzaLiu/PHP-FIG/blob/master/PSR-1-basic-coding-standard-cn.md 基本代码规范 本篇规范制定 ...
- C++:主要几种排序算法及其复杂度
常见排序算法稳定性和复杂度分析快速简记以及转载 分类: 算法 2012-02-07 22:18 399人阅读 评论(1) 收藏 举报 算法mergeshell http://blogold.chin ...
- Android 图片的缩略图
<1>简介 之前往往是通过Bitmap.Drawable和Canvas配合完成,需要写一系列繁杂的逻辑去缩小原有图片,从而得到缩略图. 现在我给大家介绍一种比较简单的方法:(网上有) 在A ...
- nodpad++正则替换
则表达式是一个查询的字符串,它包含一般的字符和一些特殊的字符,特殊字符可以扩展查找字符串的能力,正则表达式在查找和替换字符串的作用不可忽视,它 能很好提高工作效率. EditPlus的查找,替换,文件 ...
- TEET
[{"PROCESS_STORE_TIME":"3min 11s","PROCESS_GET_FILE_TIME":"3min&q ...
- Spring Security资料
Spring Security学习总结一 Spring Security3.1登陆验证 Spring security初探
- Residual Networks <2015 ICCV, ImageNet 图像分类Top1>
本文介绍一下2015 ImageNet中分类任务的冠军——MSRA何凯明团队的Residual Networks.实际上,MSRA是今年Imagenet的大赢家,不单在分类任务,MSRA还用resid ...