顾名思义:属性选择器就是根据属性值来选择元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>属性选择器</title>
<!-- 顾名思义:属性选择器就是根据属性值来选择元素 -->
<style type="text/css">
img [width] {
border: blue 10px solid;
background-color: #0000FF;
/* 这个选择器会选择HTML中所有包含一个width属性的图片 */
}
img[height="300"]{
border: red thin solid;
/* 这个选择器会选择height属性为300px的图像 */
background-color: #0000FF;
}
img[alt ~= "flowers"]{
border: #ccc thin solid;
/* 这个选择器会选择alt属性包含单词 flowers 的所有图像 */
}
</style>
</head>
<body>
<div >
<img src="../../HelloHBuilder/img/HBuilder.png" height="300" >
<img src="../../HelloHBuilder/img/HBuilder.png" >
<img src="../../HelloHBuilder/img/HBuilder.png" alt="flowers">
</div>
</body>
</html>