css3——属性选择器
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css3——属性选择器相关的知识，希望对你有一定的参考价值。
lE[attr]只使用属性名，但没有确定任何属性值
lE[type="text"]指定属性名，并指定了该属性的属性值
lE[attr~="value"]指定属性名，并且具有属性值，此属性值是一个词列表，并且以空格隔开，其中词列表中包含了一个value词，而且等号前面的“?”不能不写
lE[attr^="value"]指定了属性名，并且有属性值，属性值是以value开头的
lE[attr$="value"]指定了属性名，并且有属性值，而且属性值是以value结束的
lE[attr*="value"]指定了属性名，并且有属性值，而且属值中包含了value
lE[attr|="value"]指定了属性名，并且属性值是value或者以“value-”开头的值（比如说zh-cn）
l备注：IE7及以上支持;
实例：
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <style> p{height:30px;} p[num]{border:1px solid #ccc;} p[num=fifth]{color:#999;} p[num~=one]{color:#cc1c1c;} p[num^=s]{background:pink;} p[num$=d]{color:red;} p[num*=c]{padding-left:20px;} p[num|=fifth]{background:green;} </style> </head> <body> <p num="first one">111111</p> <p num="second">22222</p> <p num="third">333333</p> <p num="forth">444444</p> <p num="fifth">555555</p> <p num="fifth-five">555555</p> </body> </html>
以上是关于css3——属性选择器的主要内容，如果未能解决你的问题，请参考以下文章