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: ...
随机推荐
- Maven新建项目产生Could not calculate build plan: Plugin org.apache.maven.plugins:maven-resource
需要 打开并修改conf/settings.xml,添加如下内容: <!-- 设置本地仓库位置--> <localRepository>F:\maven\repository& ...
- 【OCP-12c】2019年CUUG OCP 071考试题库(76题)
76.View the exhibit and examine the description of the DEPARTMENTSand EMPLOYEEStables. The retrieve ...
- IIS7的网站通过https访问提示ssl_error_rx_record_too_long
IIS7的网站通过https访问,提示ssl_error_rx_record_too_long,如下图所示: 解决办法: 一.导入服务器的SSL证书至IIS 1.打开IIS,找到服务器证书 2.导入本 ...
- mongodb 3.0下载安装、配置及mongodb最新特性、基本命令教程详细介绍
mongoDB简介(本文由www.169it.com搜集整理) MongoDB是一个高性能,开源,无模式的文档型数据库,是目前在IT行业非常流行的一种非关系型数据库(NoSql).它在许多场景下可用于 ...
- 官宣,PyTorch 1.0 稳定版本现已推出
简评:快来一起快乐地学习吧. 随着 PyTorch 生态系统和社区继续为开发人员提供有趣的新项目和教育资源,今天(12 月 7日)在 NeurIPS 会议上发布了 PyTorch 1.0 稳定版.研究 ...
- 细化Azure RBAC权限
Azure RBAC权限的细化一直是比较繁琐的事情,以下示例抛砖引玉,供大家参考 客户需求: 新用户在指定资源组下权限需求如下: 一.禁止以下权限 1. 调整虚拟机大小配置 2. 删除&停止虚 ...
- XorPay 个人支付平台增加 个人支付宝支付接口
XorPay 今天新增 个人支付宝当面付 接口,欢迎大家使用. 「 XorPay 支付平台」 已经同时支持 个人微信支付接口 和 个人支付宝接口. 个人可用的 支付宝/微信支付 接口,支持 当面付 ...
- C语言奇淫技巧,字符串的三种表示方法,不会用不是合格的程序员
1.在C语言中,是将字符串作为字符数组来处理的,字符串是逐个存放到数组元素中的 例如用一个一维的字符数组存放字符串"I am a boy.",如下代码: char c[12] = ...
- PHP下的浮点运算不准的解决办法
首先看一段代码: 首先看一段代码: <?php $a = 0.1; $b = 0.7; var_dump(($a + $b) == 0.8); 打印出来的值居然为 boolean false P ...
- mac安装gdb调试(转载)
转载自:http://blog.plotcup.com/a/129 最近一直用go写一个项目,本想在mac上用gdb调试一下,但xcode4.6带的gdb版 本还是太低了,不支持go,只好自己安装一个 ...