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系列之属性选择器的更多相关文章

  1. CSS3 01. CSS3现状、属性选择器、伪类选择器、结构伪类、伪元素选择器、颜色、文本阴影shadow、盒子模型、私有化前缀

    CSS 3 现状 兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 : CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 ...

  2. css3新增的属性选择器

    使用css选择器,可以实现一个样式对应多个html文档的元素,在{}前面的部分就是"选择器",指明了样式的作用对象. 在CSS中追加了三个属性选择器:[att*=val].[att ...

  3. 晨读笔记:CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  4. CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  5. CSS3知识点总结----属性选择器

    1.E[attr]只使用属性名,但没有确定任何属性值 2.E[attr="value"]指定属性名,并指定了该属性的属性值 3.E[attr~="value"] ...

  6. css3 -- 属性选择器

    属性选择器: 1.CSS属性选择器 属性选择器E[attr="value"]{} 包含属性选择器E[attr~="value"]{} 2.CSS3的新属性选择器 ...

  7. 【前端开发系列】—— CSS3属性选择器总结

    想想自己为什么要学CSS,作为一个开发过前端的人员来说,调试一个图片花了半天的时间,最后发现分隔符用错了,实在是一件很丢人的事情.因此,痛下决心来学习CSS,最近一周也会更新下相关的学习笔记. CSS ...

  8. css3系列-2.css中常见的样式属性和值

    css3系列-2.css中常见的样式属性和值 继续上一篇文章的继续了解css的基础知识,关注我微信公众号:全栈学习笔记 css中常见的样式属性和值 字体与颜色 背景属性 文本属性 边框属性 内外边距 ...

  9. CSS3 选择器——属性选择器

    上一节在<CSS3选择器——基本选择器>中主要介绍了CSS3选择器的第一部分,这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器.属性选择器早在CSS2中就被引入了,其主要作用 ...

随机推荐

  1. 19. [链表][双指针]删除链表的倒数第N个节点

    19. 删除链表的倒数第N个节点 方法一:哨兵节点+快慢指针 在本题中,快慢指针的用法为:让快指针先走几步,步数由 \(n\) 决定. 使用哨兵节点的理由是为了避免删除节点为头结点引发的空指针异常. ...

  2. Django( 学习第四部 Django的views视)

    目录 视图层 JsonResponse对象 form表单之文件上传 request方法及属性 FBV与CBV JsonResponse对象 前端序列化 JSON.stringify() json.du ...

  3. 万字长文深入理解java中的集合-附PDF下载

    目录 1. 前言 2. List 2.1 fail-safe fail-fast知多少 2.1.1 Fail-fast Iterator 2.1.2 Fail-fast 的原理 2.1.3 Fail- ...

  4. No compatible servers were found,You'll need to cancel this wizard and install one!

    原文链接:https://www.jianshu.com/p/a11f93fb16ce 问题原因 笔记本重装的windows系统,重新安装mysql的时候,显示错误,看了一下缺失服务,实际上可能是缺少 ...

  5. 论文解读《ImageNet Classification with Deep Convolutional Neural Networks》

    这篇论文提出了AlexNet,奠定了深度学习在CV领域中的地位. 1. ReLu激活函数 2. Dropout 3. 数据增强 网络的架构如图所示 包含八个学习层:五个卷积神经网络和三个全连接网络,并 ...

  6. Error response from daemon: conflict: unable to delete a2f2e369e78e (cannot be forced) - image has dependent child images

    错误现象: Error response from daemon: conflict: unable to delete a2f2e369e78e (cannot be forced) - image ...

  7. DTU连接不稳定有什么办法

    DTU是一种物联网的终端设备,在工业信息化的不断推进的大背景下,DTU的市场需求也越来越大,本身具有网络覆盖范围广.资费低.数据传输准确及时等众多优点.但在使用的过程中DTU会出现很多问题,比如DTU ...

  8. Python+Django实现微信扫码支付流程

    Python+Django实现微信扫码支付流程 关注公众号"轻松学编程"了解更多. 获取源码可以加我微信[1257309054],文末有二维码. [微信公众号支付官网]https: ...

  9. 【面经】面试官:如何以最高的效率从MySQL中随机查询一条记录?

    写在前面 MySQL数据库在互联网行业使用的比较多,有些小伙伴可能会认为MySQL数据库比较小,存储不了很多的数据.其实,这些小伙伴是真的不了解MySQL.MySQL的小不是说使用MySQL存储的数据 ...

  10. 【KataDaily 191015】Sort the Gift Code

    题目: Happy Holidays fellow Code Warriors! Santa's senior gift organizer Elf developed a way to repres ...