<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>5分23s 属性选择器</title>
<style>
/* 给所有有x属性的div元素添加样式：背景颜色红色 文字颜色白色 */
/* 用类选择器：代码量大 需修改代码 需class=“test */
.test{
color: #fff;
background-color: #f00;
}
/* 【属性名】：有没有属性名指定的属性 */
div[x]{ /* div与【x】中间不能有空格！ 先试用基本选择器选择页面元素 接着在结果中石油属性选择器进行过滤*/
color: #fff;
background-color: #f00;
}
/*div[x=’21‘] 单引号！*/
/* 【属性名=值】：有属性名指定的属性，并且属性名等于指定值 */
/* div[x^='2'] 满足基本选择器 有属性名指定的属性 并且属性值以指定的值开头 */
/* div[x$='3'] 满足基本选择器 有属性名指定的属性 以指定的值结尾*/
/* div[x*='2'] 满足基本选择器 有属性名指定的属性 并且属性值 */
</style>
</head>
<body>
<!-- 自定义在html代码中可以自己定义html属性 -->
<!-- 浏览器的容错性很强 -->
<div x="21">1</div>
<div>2</div>
<div x="31">3</div>
<div x="22">4</div>
<div x="123">5</div>
</body>
</html>
4987
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
