CSS [attribute~=value] 选择器
实例
选择 titile 属性包含单词 "flower" 的元素,并设置其样式:
<!DOCTYPE html><html><head><style>[title~=flower] {border: 5px solid yellow;}</style></head><body><p>标题属性包含单词“flower”的 img 将获得黄色边框。</p><img src="/images/klematis.jpg" title="klematis flower" width="150" height="113"><img src="/images/img_flwr.gif" title="flowers" width="224" height="162"><img src="/images/landscape.jpg" title="landscape" width="160" height="120"></body></html>
浏览器支持
表格中的数字注明了完全支持该属性的首个浏览器版本。
| 选择器 | |||||
|---|---|---|---|---|---|
| [attribute~=value] | 4.0 | 7.0 | 2.0 | 3.1 | 9.6 |
注释:对于 IE8 及更早版本的浏览器中的 element>element,必须声明 <!DOCTYPE>。
定义和用法
[attribute~=value] 选择器用于选取属性值中包含指定词汇的元素。
相关页面
CSS 教程:CSS 属性选择器