选择符号:E { sRules } 类型,直接选择器。E是元素的表示。
[]里面的是属性选择器:
E [ attr ] { sRules } 一个元素,有attr属性的
E [ attr = value ] { sRules }
·E1 E2 { sRules } 包含, E1的子元素和E2都使用这个样式,
<style type="text/css">
div button{ 所有div里面的button都变颜色
background:red;
}
</style>
</head>
<body>
<div id="div1">
hello
<button>
大家好
</button>
<p>
<button>哥们</button>
</p>
</div>
·E1 > E2 { sRules } 只选择e1的子元素:
<style type="text/css">
div>button{
background:red;
}
</style>
</head>
<body>
<div id="div1">
hello
<button>
大家好
</button>
·E.className { sRules }
1: .calssName {...} 所有的元素,都可以使用这个样式表。
2: E.className{...} 只有E这个元素,使用这个样式 表才有效。
div.abc{ div下的class="abc"的可以使用
background:red;
}
·E1 , E2 , E3 { sRules } 对E1,E2,E3,都使用同一个样式表,逗号间隔,平级的
div.abc,button,p,hr,#div1{ 都是平级的,都使用这个样式表
background:red;
}
div下的样式表使用abc的button使用
div.abc button{
background:red;
}