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 ...
随机推荐
- springboot之activemq安装与实践
环境:腾讯云centos7 注意:activemq安装插件,可能会报错.本人是主机名的问题,所以修改了主机名. vim /etc/hosts vim /etc/hostname 修改这两个文件,并重启 ...
- PHP mysql_num_rows() 函数 返回结果集中行的数目。
定义和用法 mysql_num_rows() 函数返回结果集中行的数目. 语法 mysql_num_rows(data) 参数 描述 data 必需.结果集.该结果集从 mysql_query() 的 ...
- Java NIO 学习笔记 读写结合补充
小练习:nio读写文件,将fileread中的内容读取到filewrite中 try { //创建输入通道 FileInputStream fis = new FileInputStream(&quo ...
- 【作品集】UX作品集
https://www.uisdc.com/10-inspiring-ux-portfolios http://jeya.io http://antonmircea.com/FinalUX.pdf h ...
- 关于CAShapeLayer的一些基本操作
设置圆形进度条: 实现效果如下: 实现代码如下:(注释很详细啦!!!) UIView *circleView = [[UIView alloc]initWithFrame:CGRectMake(, , ...
- STM32F10xx(高容量)WiFi模块的初始化和使用
本次实验是使用每次传输不超过200B的ESP8266芯片的WiFi模块,WiFi模块内部自有驱动,我们初始化它,只需要发送指定的指令给他就可以了,指定的指令其实是使用USART3的复用的PB10和PB ...
- maven-mybatis代码生成
1.创建测试工程 选择maven Project 点击next 填写项目名称 点击 finish 项目创建完成 2.pom.xml <project xmlns="http://mav ...
- SAP HANA2可视化客户端工具
TreeSoft数据库管理系统使用JAVA开发,采用稳定通用的springMVC +JDBC架构,实现基于WEB方式对 MySQL,Oracle,PostgreSQL,MSSQL, Hive,DB2, ...
- Chrome安装json格式化工具jsonView
1.下载jsonView 有条件的童鞋可以去谷歌商店下载安装https://chrome.google.com/webstore/detail/pmajcnnfhjcebiafkonednglookd ...
- 【Qt开发】【ARM-Linux开发】 QT在ARM上显示字体的问题
在PC机上利用QT开发的应用程序在设置字体时,在PC上运行,可根据自己的设置,字体随之变大或变小.而移植到ARM上运行时发现,显示字体与所设置的字体不用,字体普遍偏小.经过上网搜索发现,是环境变量字库 ...