css3系列之属性选择器
Attribute Selectors(属性选择器)
E[attr ~="val"] E[attr |="val"] E[attr ^="val"] E[attr $="val"] E[attr *="val"]
E[attr ~="val"]
我们平常用的属性选择器是 E[data="a"],我们来看看他们两个有什么区别:

E[attr |="val"] 这个|是 \ 这个键的|
选择以val 开头的元素,以val开头的元素后面可以加-

E[attr ^="val"] E[attr $="val"]
这两个选择器比较简单,我就放在一起讲了:
E[attr ^="val"] 以 val 开头的
E[attr $="val"] 以 val 结尾的

E[attr *="val"]
里面只要包含着 val 就可以选中

css3系列之属性选择器的更多相关文章
- CSS3 01. CSS3现状、属性选择器、伪类选择器、结构伪类、伪元素选择器、颜色、文本阴影shadow、盒子模型、私有化前缀
CSS 3 现状 兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 : CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 ...
- css3新增的属性选择器
使用css选择器,可以实现一个样式对应多个html文档的元素,在{}前面的部分就是"选择器",指明了样式的作用对象. 在CSS中追加了三个属性选择器:[att*=val].[att ...
- 晨读笔记:CSS3选择器之属性选择器
一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...
- CSS3选择器之属性选择器
一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...
- CSS3知识点总结----属性选择器
1.E[attr]只使用属性名,但没有确定任何属性值 2.E[attr="value"]指定属性名,并指定了该属性的属性值 3.E[attr~="value"] ...
- css3 -- 属性选择器
属性选择器: 1.CSS属性选择器 属性选择器E[attr="value"]{} 包含属性选择器E[attr~="value"]{} 2.CSS3的新属性选择器 ...
- 【前端开发系列】—— CSS3属性选择器总结
想想自己为什么要学CSS,作为一个开发过前端的人员来说,调试一个图片花了半天的时间,最后发现分隔符用错了,实在是一件很丢人的事情.因此,痛下决心来学习CSS,最近一周也会更新下相关的学习笔记. CSS ...
- css3系列-2.css中常见的样式属性和值
css3系列-2.css中常见的样式属性和值 继续上一篇文章的继续了解css的基础知识,关注我微信公众号:全栈学习笔记 css中常见的样式属性和值 字体与颜色 背景属性 文本属性 边框属性 内外边距 ...
- CSS3 选择器——属性选择器
上一节在<CSS3选择器——基本选择器>中主要介绍了CSS3选择器的第一部分,这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器.属性选择器早在CSS2中就被引入了,其主要作用 ...
随机推荐
- 缩略图调查——抖音客户端/PC/iphone
最近对抖音有点上瘾,经常看到这样的视频列表: 由于抖音平台的限制,用户最多只能上传60s的视频,因此分段为3个视频.而在视频列表的缩略图模式下,三个视频的封面恰好组合成一张图像.这种方式比较符合审美标 ...
- Android测试工具 UIAutomator介绍
UI Automator 测试工具定义以及用途 UI Automator 测试框架提供了一组 API,用于构建在用户应用和系统应用上执行交互的界面测试.通过 UI Automator API,您可以执 ...
- maven 的安装与环境变量配置
在http://maven.apache.org下载maven安装包 一.Windows 1.解压压缩包: jar -xvf "D:/apache-maven-3.5.0-bin.zip&q ...
- Java 第三课 数组排序
1.java.util.Arrays.sort(arr) //升序 2.冒泡排序:相邻元素比较 for (int i=0; i <arr.length-1; i++){//内部遍历一次,确定最 ...
- origin添加两个Y轴
1. 选中X和两个Y 2. 点击Double Y 3. 关掉gap to Symbol,否则Line+Symbol这种显示方式可能显示不出线条
- STM32入门系列-GPIO工作模式及LED电路原理
GPIO工作模式 由于GPIO内部的结构关系,决定了GPIO可配置成以下几种模式. 输入模式 在输入模式时,施密特触发器打开,输出被禁止.可通过输入数据寄存器GPIOx_IDR读取I/O状态.输入模式 ...
- JMeter实战(三) 界面使用
JMeter 有 2 种运行方式,一种是 CLI,一种是 GUI,本篇文章就来介绍一下后者,图形用户界面,因为后续文章大部分都是基于 GUI 的. 本文演示的是英文版,想用中文的同学可以在菜单栏点击 ...
- python网络编程(TCP/IP、发邮件)
TCP/IP 关注公众号"轻松学编程"了解更多. 计算机为了联网,就必须规定通讯协议,早期的计算机网络是由各个厂商规定的一些协议,他们之间互不兼容. 为了把全世界的电脑能够连接到一 ...
- mysql运维-slave_skip_errors
1 简介 mysql在主从复制过程中,由于各种的原因,从服务器可能会遇到执行BINLOG中的SQL出错的情况,在默认情况下,服务器会停止复制进程,不再进行同步,等到用户自行来处理. sla ...
- python开发基础(二)常用数据类型调用方法
1 数字: int 2 3 int : 转换,将字符串转化成数字 4 num1 = '123' 5 num2 = int (a) 6 numadd = num2 +1000 7 print(num2) ...