实例代码：
<html>
<head>
<meta charset="utf-8">
<style>
img[title~=flower]{ /*这里有个~符号*/
border:12px solid yellow;
}
.img1{
width:100px;
height:50px;
}
.img2{
width:150 ;
height:100px;
}
.img3{
width:200px;
height:150px;
}
</style>
</head>
<body>
<h1> CSS [attribute~="value"]选择器</h1>
<p>title 属性包含“flower” 的所有图像会有黄色边框。</p>
<img class="img1"src="img/img1.jpg" title="tree"></img>
<img class="img2"src="img/img2.jpg" title="grass"></img>
<img class="img3"src="img/img3.jpg" title="tree flower"></img>
</body>
</html>
运行效果：
评论