属性选择器在CSS2中引入，使我们可以根据元素的属性及属性值来选择元素。那么css有几种属性选择器？下面本篇文章就来给大家介绍一下CSS 属性选择器，希望对大家有所帮助。
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>
效果图：
