资讯专栏INFORMATION COLUMN

CSS笔记——属性选择器

Betta / 840人阅读

摘要:存在和值属性选择器这些属性选择器尝试匹配精确的属性值该选择器选择包含属性的所有元素,不论的值为何。该选择器仅选择属性被赋值为的所有元素。属性选择器的区别是完整单词类型的比较符号拼接字符串类型的比较符号

1.存在和值(Presence and value)属性选择器
这些属性选择器尝试匹配精确的属性值:
[attr]:该选择器选择包含 attr 属性的所有元素,不论 attr 的值为何。
[attr=val]:该选择器仅选择 attr 属性被赋值为 val 的所有元素。
[attr~=val]:该选择器仅选择具有 attr 属性的元素,而且要求 val 值是 attr 值包含的被空格分隔的取值列表里中的一个。

 

2.子串值(Substring value)属性选择器
这种情况的属性选择器也被称为“伪正则选择器”,因为它们提供类似 regular expression 的灵活匹配方式(但请注意,这些选择器并不是真正的正则表达式):
[attr|=val] : 选择attr属性的值是 val 或值以 val- 开头的元素(注意,这里的 “-” 不是一个错误,这是用来处理语言编码的)。
[attr^=val] : 选择attr属性的值以 val 开头(包括 val)的元素。
[attr$=val] : 选择attr属性的值以 val 结尾(包括 val)的元素。
[attr*=val] : 选择attr属性的值中包含子字符串 val 的元素(一个子字符串就是一个字符串的一部分而已,例如,”cat“ 是 字符串 ”caterpillar“ 的子字符串)。

 

CSS 属性选择器 ~=, |=, ^=, $=, *= 的区别
"value 是完整单词" 类型的比较符号: ~=, |=
"拼接字符串" 类型的比较符号: ^=, $=, *=

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1507.html

相关文章

  • HTML/CSS笔记01

    摘要:参数拼接在浏览器的地址栏请求报文格式参数放到请求报文请求体中进行传递表单元素单行文本框密码框单选按钮复选按钮附件提交按钮拓展搜索框,日期框,数字框,框的属性参数的不能缺省参数的按钮的时候不能缺省提示语用在单选按钮和复选按钮中表示默认选中 get 参数拼接在浏览器的地址栏 url?k=v&k=v 请求报文格式: ...

    KunMinX 评论0 收藏0
  • HTML/CSS笔记01

    摘要:参数拼接在浏览器的地址栏请求报文格式参数放到请求报文请求体中进行传递表单元素单行文本框密码框单选按钮复选按钮附件提交按钮拓展搜索框,日期框,数字框,框的属性参数的不能缺省参数的按钮的时候不能缺省提示语用在单选按钮和复选按钮中表示默认选中 get 参数拼接在浏览器的地址栏 url?k=v&k=v 请求报文格式: ...

    Lin_YT 评论0 收藏0
  • css专业术语笔记

    摘要:属性如等,称作的属性。如属性值属性冒号后面的所有内容统一称为属性值。例如声明属性名加上属性值就是声明例如声明块声明块是花括号包裹的一系列声明,例如规则或规则集出现了选择器,而且后面还跟着声明块。1. 属性 如height、color等,称作css的属性。 2. 值 在css中,如:10px, 50%, #ccc等这些都称作css的值。比较常见的类型值有:整数值,数值,百分比值,长度值,颜色值...

    番茄西红柿 评论0 收藏0
  • 前端菜鸟笔记 Day-3 CSS基础

    摘要:派生选择器依据元素的位置关系来定义样式。称其为上下文选择器,称其为派生选择器。在现在布局中,选择器常常用于建立派生选择器。和一样,也可被用作派生选择器。 文章大纲来源:【Day 3】HTML复习 + CSS基础 初识CSS 入门CSS 初识CSS 层叠样式表(Cascading Style Sheets),即前端常说的CSS。 内容引用:CSS 简介 样式解决了什么问题? HTML...

    mingzhong 评论0 收藏0
  • 前端菜鸟笔记 Day-3 CSS基础

    摘要:派生选择器依据元素的位置关系来定义样式。称其为上下文选择器,称其为派生选择器。在现在布局中,选择器常常用于建立派生选择器。和一样,也可被用作派生选择器。 文章大纲来源:【Day 3】HTML复习 + CSS基础 初识CSS 入门CSS 初识CSS 层叠样式表(Cascading Style Sheets),即前端常说的CSS。 内容引用:CSS 简介 样式解决了什么问题? HTML...

    DangoSky 评论0 收藏0
  • CSS基础教程笔记

    摘要:属性只能在每个文档中出现一次选择器和派生选择器在现代布局中,选择器常常用于建立派生选择器。和一样,也可被用作派生选择器元素也可以基于它们的类而被选择属性选择器可以为拥有指定属性的元素设置样式,而不仅限于和属性。 博客主要记录学习的笔记,如有错误,欢迎指出 来源:http://www.w3school.com.cn/ 简介 CSS概述 CSS 指层叠样式表 (Cascading ...

    2i18ns 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<