css选择器找亲戚
1、first-child
first-child表示选择列表中的第一个标签。代码如下:
li:first-child{background:#090}
上面的意思是,li 列表中的 第一个li模块的背景颜色。
2、last-child
last-child表示选择列表中的最后一个标签,代码如下:
li:last-child{background:#090}
3、nth-child(3)
表示选择列表中的第3个标签,代码如下:
li:nth-child(3){background:#090}
上面代码中的3也可以改成其它数字,如4、5等。想选择第几个标签,就填写几。
4、nth-child(2n)
这个表示选择列表中的偶数标签,即选择 第2、第4、第6…… 标签。
5、nth-child(2n-1)
这个表示选择列表中的奇数标签,即选择 第1、第3、第5、第7……标签。
6、nth-child(n+3)
这个表示选择列表中的标签从第3个开始到最后。
7、nth-child(-n+3)
这个表示选择列表中的标签从0到3,即小于3的标签。
8、nth-last-child(3)
这个表示选择列表中的倒数第3个标签。
css选择器找亲戚的更多相关文章
- css选择器
常用css选择器,希望对大家有所帮助,不喜勿喷. 1.*:通用选择器 * { margin: 0; padding: 0; } 选择页面上的全部元素,通常用于清除浏览器默认样式,不推荐使用. 2.#i ...
- js,jq,css选择器
js获取节点: var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; / ...
- 【CSS】使用CSS选择器
CCS选择器的作用是找出某类元素.以便使我们使用style元素或者外部样式表对这类元素设置样式. 1.使用CSS基本选择器 有些选择器使用起来非常简单,我们把这部分选择器称为基本选择器(basic s ...
- CSS选择器性能分析
写了几篇关于js的博客,也是关于性能的,现在,我觉得有必要那css来认真分析一下了.之前只是看别人这么写就跟着写,但是没有去研究这样写或者是不是正确的写法,性价比怎么样,渲染的效率好么!这些都没有考虑 ...
- 关于CSS选择器的效率问题
最近一段时间接触CSS比较多,所以从网上找了写资料,这里做下总结. 以下是CSS选择器的效率排名: id选择器(#myid) 类选择器(.myclassname) 标签选择器(div,h1,p) 相邻 ...
- 第七十节,css选择器
css选择器 学习要点: 1.选择器总汇 2.基本选择器 3.复合选择器 4.伪元素选择器 本章主要探讨 HTML5中 CSS选择器,通过选择器定位到想要设置样式的元素.目前CSS选择器的版本已经升 ...
- CSS选择器渲染效率
1 浏览器如何识别你的选择器 首先我们需要清楚,浏览器是如何读取选择器,以识别样式,并将相应的样式附于对应的HTML元素,达到美化页面的效果.Chris Coyier曾在<Efficiently ...
- jQuery选择器与CSS选择器
1. 通过位置选择的几个操作: :first:默认情况下是相对整个页面来说的第一个,如:li:first表示整个页面的第一个li元素,而ul li:first表示整个页面的第一个li元素,并且是在ul ...
- CSS 选择器简介
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 选择器权重 如果以4位数表示选择符权重,那么: 元素选择器的权重是1: id 选择器的权重为100: cl ...
随机推荐
- RecyclerView下拉刷新和上拉加载更多实现
RecyclerView下拉刷新和上拉加载更多实现 转 https://www.jianshu.com/p/4ea7c2d95ecf 在Android开发中,RecyclerView算是使用频率非 ...
- 浅谈smarty模板的mvc框架
最近接触了一个大项目,php做的后台管理,融合了smarty模板+mvc框架+phpcms内容管理,,,这个项目简直就是php的精华,于是小编大哥对项目小女子产生了兴趣,打算一点一点把她征服.现在小吃 ...
- Win7 双系统安装Centos7,并由windows引导程序引导
1. 在windows磁盘管理中,压缩卷,腾出40G,需保证一个磁盘设备最多只有3个主分区2. 网上下载centos7的dvd.iso3. 使用UltraISO刻录到U盘4. 重启系统F12使用usb ...
- 阶段5 3.微服务项目【学成在线】_day03 CMS页面管理开发_17-异常处理-可预知异常处理-异常处理测试
ResultCode有很多的实现类 cmsCode有很多类型的错误异常 pgeService内当CmsPage这个对象为空的时候,异常类型就可以抛出CmsCode里面的错误代码 if(cmsPage1 ...
- HDFS的NameNode与SecondaryNameNode的工作原理
原文:https://blog.51cto.com/xpleaf/2147375 看完之后确实对nameNode的工作更加清晰一些 在Hadoop中,有一些命名不好的模块,Secondary Name ...
- UICollectionview的头视图和尾视图
UITableView有头视图和尾视图,那么UICollectionView有没有头视图和尾视图呢? 答案是有的. 1.新建一个类,必须继承自 UICollectionReusableView. 2. ...
- laravel5.5的定时任务详解(demo)
原文地址:https://blog.csdn.net/LJFPHP/article/details/80417552
- Java工程师学习指南第3部分:Spring与SpringMVC源码解析
本文整理了微信公众号[Java技术江湖]发表和转载过的Spring全家桶优质文章,想看到更多Java技术文章,就赶紧关注吧. 前后端分离,我怎么就选择了 Spring Boot + Vue 技术栈? ...
- Docker部署WordPress网站
WordPress是使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站,WordPress 不仅仅是一个博客程序,也是一款CMS,很多非博客网站也是用Wo ...
- manjaro 给笔记本安装18.1系统时发现中文变成了方块字
解决方案: 1.连接网络,wifi/本地连接 2.打开终端 3.同步数据 如果是第一次,我们需要先同步本地数据包,先输入 sudo pacman -Syy 4.安装字体 sudo pacman -S ...