
CSS 2 引入了属性选择器。属性选择器可以根据元素的属性及属性值来选择元素。
css有几种属性选择器?
[attribute]用于选取带有指定属性的元素。[attribute=value]用于选取带有指定属性和值的元素。[attribute~=value]用于选取属性值中包含指定词汇的元素。[attribute|=value]用于选取带有以指定值开头的属性值的元素,该值必须是整个单词。[attribute^=value]匹配属性值以指定值开头的每个元素。[attribute$=value]匹配属性值以指定值结尾的每个元素。[attribute*=value]匹配属性值中包含指定值的每个元素。
示例1:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
a[href] {
color: red;
}
</style>
</head>
<body>
<h1>可以应用样式:</h1>
<a href="#">HTML中文网!!</a>
<hr />
<h1>无法应用样式:</h1>
<a name="HTML中文网!!">HTML中文网!!</a>
</body>
</html>效果图:

示例2:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
p[class~="important"] {
color: red;
}
</style>
</head>
<body>
<h1>可以应用样式:</h1>
<p class="important warning">This is a paragraph.</p>
<p class="important">This is a paragraph.</p>
<hr />
<h1>无法应用样式:</h1>
<p class="warning">This is a paragraph.</p>
</body>
</html>效果图:

以上就是css有几种属性选择器?的详细内容,更多请关注易知道|edz.cc其它相关文章!













