css的属性选择器中属性值是区分大小写的。

以前经常看到很多人说“css中通常只有class和id的值区分大小写，属性名和属性值不区分大小写” BLAH BLAH

接手别人项目的时候排了半天bug发现：css的属性选择器对于属性值确实是区分大小写的，而对于属性名却大小写不敏感。

最开始是在querySelectorAll中发现的，测试后发现css中也具有一致的表现。

所以对于过去的那些说法，其实已经不适用于现在的场合了。

测试环境：Chrome 66 , Firefox 57。

另外附上使属性值不区分大小写的写法：https://developer.mozilla.org/zh-CN/docs/Web/CSS/Attribute_selectors

原文地址：https://www.cnblogs.com/roay/p/8760903.html

时间： 2024-10-12 19:22:06

css的属性选择器中属性值是区分大小写的。的相关文章

springboot入门_获取属性文件中的值

在上一篇文章中,记录了用springboot实现输出一个hello world到前台的程序,本文记录学习springboot读取属性文件中配置信息. 框架属性文件(application.properties) 创建一个springboot项目,并引入相关依赖,POM文件如下: 1 <?xml version="1.0" encoding="UTF-8"?> 2 <project xmlns="http://maven.apache.or

css属性选择器中[attribute~=value] 和 [attribute*=value]的区别

[attribute] 用于选取带有指定属性的元素. [attribute=value] 用于选取带有指定属性和值的元素. [attribute~=value] 用于选取属性值中包含指定词汇的元素. [attribute|=value] 用于选取带有以指定值开头的属性值的元素,该值必须是整个单词. [attribute^=value] 匹配属性值以指定值开头的每个元素. [attribute$=value] 匹配属性值以

CSS基础学习七：属性选择器

CSS语法中,对带有指定属性的 HTML 元素设置样式.可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性.(注释:Internet Explorer 7 (以及更高版本)在规定了 !DOCTYPE 的情况下支持属性选择器. IE6 及更低的版本不支持属性选择器.) CSS2引入了属性选择器.属性选择器可以根据元素的属性及属性值来选择元素. 一简单属性选择器如果希望选择有某个属性的元素,而不论属性值是什么,可以使用简单属性选择器. (1)先来一个简单的例子:

css3中的属性选择器

1.[att*=val]属性选择器该选择器的含义是如果属性att中包含了val值,则该元素可以使用这个样式.如:[id*=content]中,这个样式在页面元素中id包含content字符串的可以使用. 2.[att^=val]属性选择器该选择器的含义是如果属性att中的值以val开始,则可以使用这个样式.如:[id^=con]选择器,这个样式在页面元素中id是以con字符串开头的可以使用. 3.[att$=val]属性选择器该选器的含义是如果属性att中的值以val结束,则可以使用这个样式.如

CSS 属性选择器详解

CSS 2 引入了属性选择器. 属性选择器可以根据元素的属性及属性值来选择元素. 简单属性选择如果希望选择有某个属性的元素,而不论属性值是什么,可以使用简单属性选择器. 例子 1 如果您希望把包含标题(title)的所有元素变为红色,可以写作: *[title] {color:red;}

[转] 属性选择器.mark

CSS 2 引入了属性选择器. 属性选择器可以根据元素的属性及属性值来选择元素. 简单属性选择如果希望选择有某个属性的元素,而不论属性值是什么,可以使用简单属性选择器. 例子 1 如果您希望把包含标题(title)的所有元素变为红色,可以写作: *[title] {color:red;} 亲自试一试例子 2 与上面类似,可以只对有 href 属性的锚(a 元素)应用样式: a[href] {color:red;} 亲自试一试例子 3 还可以根据多个属性进行选择,只需将属性选择器链接在一起即

深入学习jQuery选择器系列第四篇——过滤选择器之属性选择器

× 目录 [1]简单属性 [2]具体属性 [3]条件属性前面的话属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素,对应于CSS中的属性选择器.属性过滤选择器可分为简单属性选择器.具体属性选择器和条件属性选择器三种.本文将详细该部分内容简单属性选择器 [attribute] [attribute]选择器选择拥有该属性的元素,返回集合元素 //选择拥有title属性的所有元素 $('[title]') //选择拥有title属性的所有span元素 $('span[title]') //

ｃｓｓ属性选择器

接上篇css基础选择器,这部分主要总结一下css属性选择器的用法. 属性选择器的作用:对带有指定属性的HTML 元素设置样式.使用CSS3属性选择器,你可以只指定元素的某个属性,或者你还可以同时指定元素的某个属性和其对应的属性值. 话不多说:依然上代码. .demo { margin: 50px auto; width: 300px; border: 1px solid #ccc; padding: 10px; } .over-flow{ overflow: hidden; } li { flo

Css3选择器-属性选择器

一.E[attr] E[attr]属性选择器是CSS3属性选择器中最简单的一种.如果你希望选择有某个属性的元素,而不论这个属性值是什么,你就可以使用这个属性选择器 IE6不支持这个选择器. 二.E[attr="value"] E[attr="value"]选择器和E[attr]选择器,从字面上就能很清楚的理解出来,E[attr="value"]是指定了属性值“value”,而E[attr]只是选择了有对应的属性,并没有明确指其对应的属