CSS3 常用选择器

 1  p:last-of-type{background-color: red;}  选择p中最后一项
 2
 3  p:nth-of-type(2n){background-color: red;} 隔行变色里面也可以填写even 偶数变色 n 是计数器（从 0 开始）
 4
 5  p:nth-of-type(2n+1){background-color: pink;} 隔行变色里面也可以填写odd 奇数变色
 6
 7  li:not(:last-child){border-right: 1px dashed black;} 选择全部排除最后一项，8  :last-child
10 input[type^="text"]{   /**选择具有type属性且属性值为以text开头的字符串的input元素。**/
11     background-color: red;
12 }
13
14 也可以写成[type^="text"] 这样范围更广一些
15
16 input[value$="按钮"]{  /**选择具有value属性且属性值为以按钮结尾的字符串的input元素。**/
17     background-color:pink;
18 }
19
20 input[value*="按钮"]{   /**选择具有value属性且属性值为包含按钮的字符串的input元素。**/
21     background-color: green;
22 }
23
24 div:before{display:block;content:"before伪类,前面插入内容";width: 70px;height: 60px;background-color:pink;}
25 div:after{content:"after伪类,后面插入内容";width: 60px;height: 70px;background-color: green;display:block;}
26
27 p:nth-of-type(5){background-color: pink;} 选择p元素里面第五个值

转载于:https://www.cnblogs.com/Model-Zachary/p/6095347.html

CSS3 常用选择器相关推荐

CSS3常用选择器（三）
在CSS3的选择器中,除了结构性伪类选择器外,还有一种UI元素状态伪类选择器.这些选择器的共同特征: 指定的样式只有当元素处于某种状态时才起作用,在默认状态下不起作用. 1.hover.focus.a ...
:empty css 可以用在哪些标签,CSS3 :empty 选择器
这可是个好东西,我也是这个星期才发现的,下面我们来说具体功能. p:empty { width:100px; height:20px; background:#ff0000; } A paragrap ...
CSS/CSS3常用样式与web移动端资源
CSS/CSS3常用样式与知识点 IE条件注释条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法. ...
css3常用技巧_您可能错过的5个CSS3技巧和窍门
css3常用技巧 Though, CSS3 isn't a complex language but you'll there are greater chances that you'll stum ...
[总结]CSS/CSS3常用样式与web移动端资源
CSS/CSS3常用样式与知识点 IE条件注释条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法. ...
jquery 常用选择器和方法以及遍历（超详细）
jQuery 常用选择器和和方法学习总结一.JQuery 介绍 1. 什么是 jQuery 2. jQuery 版本介绍 3. jQuery 文件介绍二.jQuery 对象 1. jQuery ...
CSS3新选择器，盒子模型，过渡动画transition，2D转换transform
关于css属性选择器常用的有: id选择器(#box),选择id为box的元素类选择器(.one),选择类名为one的所有元素标签选择器(div),选择标签为div的所有元素后代选择器(#box ...
web前端开发课程安排，写出jquery常用选择器
面试知识点主要内容包括html,css,前端基础,前端核心,前端进阶,移动端开发,计算机基础,算法与数据结构,设计模式,项目等等. html 1.浏览器页面有哪三层构成,分别是什么,作用是什么? 2 ...
html5类选择器选择权重,Python Html5和CSS3的新增功能：CSS权重与CSS3新增选择器
一.CSS权重概念 CSS权重概念:指的是样式的优先级,有两条或多条样式作用于一个元素,权重高的那条样式对元素起作用,权重相同的,后写的样式会覆盖前面写的样式. 二.权重的等级 2.1.权重的等级划分 ...

CSS3 常用选择器

CSS3 常用选择器相关推荐

最新文章

热门文章