HTML5--(2)属性选择器+结构性伪类+伪类
一.属性选择器
- [att] 匹配所有具有att属性的
- [att=val] 匹配所有att属性等于“val”的
- [att~=val] 匹配所有att属性包含“val”或者等于“val”的(val必须是一个完整词)
- [att|=val] 匹配所有att属性仅仅只等于以val-’ 开头的或等于“val”(比如说zh-cn)
- [att*=val] 匹配所有att属性 包含’val’的字母 (val可以是字母) 类似模糊查询
- [att^=val] 匹配所有att属性 ‘val’开头的 (val可以是字母)
- [att$=val] 匹配所有att属性 ‘val’结束的 (val可以是字母)
二.结构性伪类
- E:nth-child(n) 表示E父级的所有子元素集合中的,第n个子节点(从前往后数 兄弟同类型标签 不可跨越其他类型标签 按所有标签索引顺序去选择)
- E:nth-last-child(n) 表示E父级的所有子元素集合中的,第n个子节点,从后向前计算 (从后往前数)
(需E选择器能选中此元素) - E:nth-of-type(n) 表示E元素父级的子元素是E集合,第n个字节点,(兄弟同类型标签 可跨越其他类型标签 按同类型标签索引顺序去选择)
- E:nth-last-of-type(n) 表示E父级的第n个字节点,从后向前计算
(需E选择器能选中此元素,且区分标签类型) - E:nth-child(odd) 匹配奇数行 同p:nth-child(2n-1)
- E:nth-child(even) 匹配偶数行 同p:nth-child(2n)
- E:empty 表示E元素中没有子节点(不能有空格,回车)。注意:子节点包含文本节点
三.伪类
- E:target 当a标签获取焦点href=”所对应的 E元素锚点的对象(超链接跳转对象)
- E:disabled 表示不可点击的表单控件disabled(禁止选中)
- E:enabled 表示可点击的表单控件
- E:checked 表示已选中的checkbox或radio (鼠标点击时)
- E:first-line 表示E元素中的第一行
- E:first-letter 表示E元素中的第一个字符(首字)
- E::selection 表示E元素在用户选中文字时
- E:not(selector) 选择非 selector 选择器的每个元素。
- E~F 表示E元素后的所有兄弟F元素(~不需要紧挨着 +需要紧挨着 毗邻)
其他属性 input::placeholder 改变文本框中提示字体样式
兼容写法input::-webkit-input-placeholder
HTML5--(2)属性选择器+结构性伪类+伪类的更多相关文章
- CSS3 选择器——笔记+实战案例(基本选择器、组合选择器、属性选择器、伪类选择器)
使用CSS3 选择器——笔记 CSS通过选择器控制HTML元素,CSS选择器对网页对象可以实现一对一.一对多或者多对一的匹配. 一.CSS3选择器分类 CSS选择器在CSS2.1选择器的基础上新增了属 ...
- CSS笔记——属性选择器
1.存在和值(Presence and value)属性选择器这些属性选择器尝试匹配精确的属性值:[attr]:该选择器选择包含 attr 属性的所有元素,不论 attr 的值为何.[attr=val ...
- CSS 选择器之基本选择器 属性选择器 伪类选择器
CSS 选择器 常见的选择器列表图 CSS选择器笔记 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className) 所有浏览器都支持类选择器,但多类选择器(.classNa ...
- 前端笔记之HTML5&CSS3(中)选择器&伪类伪元素&CSS3效果&渐变背景&过渡
一.CSS3选择器 CSS3是CSS的第三代版本,新增了很多功能,例如:强大的选择器.盒模型.圆角.渐变.动画.2D/3D转换.文字特效等. CSS3和HTML5没有任何关系!HTML5骨架中,可以用 ...
- CSS3每日一练之选择器-结构性伪类选择器
<!DOCTYPE HTML> <html> <head> <meta charset="gb2312"> <title> ...
- css 为元素选择器,css目标状态伪类,结构化选择器,多媒体选择器,清除表默认样式、属性选择器
伪元素选择器 :before 和 :after 添加的位置 :before --- 第一个子节点 :after --- 最后一个子节点 特点 1.默认是 inline 元素 2.必须包含 conten ...
- python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)
一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...
- Selectivizr-让IE6~8支持CSS3伪类和属性选择器
一.下载和demo 下载: 您可以狠狠地点击这里:selectivizr-1.0.0.zip(右键-[目标|链接另存为] 9.24K) demo: 您可以狠狠地点击这里:Selectivizr部分属性 ...
- 第91天:CSS3 属性选择器、伪类选择器和伪元素选择器
一.属性选择器 其特点是通过属性来选择元素,具体有以下5种形式: 1.E[attr] 表示存在attr属性即可: div[class] 2.E[attr=val] 表示属性值完全等于val: ...
随机推荐
- C#获取图片扩展名
代码: private string GetImageExtension(MemoryStream ms) { try { Image image = Image.FromStream(ms); if ...
- hibernate SQL Error: 8152, SQLState: 22001
这种会出现字符串截断 数据库字段长度设置太小,改大即可.
- java学习笔记—标准连接池的实现(27)
javax.sql.DataSource. Java.sql.* DataSource 接口由驱动程序供应商实现.共有三种类型的实现: 基本实现 - 生成标准的 Connection 对象 – 一个D ...
- How to write date range query in Nest ElasticSearch client?
Looking at the source code, there are two overloads of the OnField method. When I use the the that t ...
- [JS] 屏蔽右键
if (window.Event) document.captureEvents(Event.MOUSEUP); function nocontextmenu() { event.cancelBubb ...
- Windows系统下如何在cmd命令窗口中切换Python2.7和Python3.6
针对在同一系统下我们可能安装多个版本的Python,毕竟Python2.7与Python3.6还是有不同的需求,但是在用Cmd命令窗口是我们可能默认的系统变量环境是其中一个版本,当我们需要在cmd命令 ...
- 转一下大师兄的"MySQL高可用架构之MHA"
简介: MHA(Master High Availability)目前在MySQL高可用方面是一个相对成熟的解决方案,它由日本DeNA公司youshimaton(现就职于Facebook公司)开发,是 ...
- 【Quartz】工作原理
本文参考至http://www.cnblogs.com/davidwang456/p/4205237.html和https://blog.csdn.net/guolong1983811/article ...
- 【转载】Java 9 新特性——模块化
来自 <http://www.jianshu.com/p/053a5ca89bbb#> 前言 年,我们将迎来 Java 语言的 22 岁生日,22岁,对于一个人而言,正是开始大展鸿图的年纪 ...
- PCA简单实现
''' 总结一下PCA的算法步骤: 设有m条n维数据. 1)将原始数据按列组成n行m列矩阵X 2)将X的每一行(代表一个属性字段)进行零均值化,即减去这一行的均值 3)求出协方差矩阵C=1/m*(XX ...