2,根据属性值选择
/*[title~=hello]{color:red;} /*如果含有值 */*/
[title="world"] {color: red;} /*如果值等于＊／
<h2 title="hello world">Hello world</h2>
<h2 title="world">Hello world</h2>。
运行效果：
3,特定属性选择类型
*[title|="h"]{color: red;}
当有属性title并且title属性的值是以h或者h-开头的元素
E[att^="val"]，选择器匹配元素E，且E元素定义了属性att,att 的属性值是以val开头的任何字符串。
E[att$="val"]，选择器匹配元素E，且E元素定义了属性att，att的属性值以val结尾的任何字符串。
E[att*="val"]，选择器匹配元素E，且元素定义了属性att，att属性值任意位置包含了"val"。
代码例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>选择器</title>
<style type="text/css">
a[class^=icon]{
background: green;
color:#fff;
}
a[href$=pdf]{
background: orange;
color: #fff;
}
a[title*=more]{
background: blue;
color: #fff;
}
</style>
</head>
<body>
<a href="xxx.pdf">我链接的是PDF文件</a>
<a href="#" class="icon">我类名是icon</a>
<a href="#" title="我的title是more">我的title是more</a>
</body>
</html>
运行效果：
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
