<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS3新增加的属性选择器</title>
<style type="text/css">
/*input[class]表示选择input元素含有class属性*/
input[class]{
background-color: green;
}
/*查找class为classno3的改变属性*/
input[class="classno3"]{
background-color: red;
}
/*查找class中以t开头的*/
input[name^=t]{
background-color: blue;
}
/*查找class中以no1结尾的*/
input[name$=no1]{
background-color: pink;
}
/*查找class中含有a的元素*/
input[name*=a]{
background-color: silver;
}
</style>
</head>
<body>
<input type="text" value="tom" name="tomno1" class="classno1"><br>
<input type="text" value="jack" name="jackno1" class="classno2"><br>
<input type="text" value="marry" name="marryno1" class="classno3"><br>
<input type="text" value="chao" name="chaono4" class="classno4"><br>
<input type="text" value="shan" name="shanno5" class="classno5"><br>
</body>
</html>
CSS3新增加的属性选择器
原文:http://www.cnblogs.com/qianjilou/p/6371857.html