css属性选择符的应用

注释Internet Explorer 7 (以及更高版本)在规定了 !DOCTYPE 的情况下支持属性选择器。IE6 及更低的版本不支持属性选择器。

[title]{color:red;}  //为带有 title 属性的所有元素设置样式:

[title="website"]{color:red;}  //为 title="W3School" 的所有元素设置样式:

[title~=hello]{color:red;}  //为包含指定值的 title 属性的所有元素设置样式。适用于由空格分隔的属性值:

[title|=hello]{color:red;}  //title属性值以hello开头,并用连接符"-"分隔的字符串的E元素。

<a href="#" title="hello-txt-aa"></a>

属性选择器在为不带有 class 或 id 的表单设置样式时特别有用:

input[type="text"]{color:red;}

注意:以上为CSS2 的应用

============以下为CSS3新增选择器=================================

E[attr^="val"]  //选择具有att属性且属性值为以val开头的字符串的E元素。

E[attr$="val"]  //选择具有att属性且属性值为以val结尾的字符串的E元素。

E[attr*="val"]  //选择具有att属性且属性值为包含val的字符串的E元素。

 

原文地址:https://www.cnblogs.com/daxian2012/p/2583205.html