选择器的作用
-
选择对应的标签，为之添加样式
标签选择器
- 根据标签名找到标签
eg:
<div>div1</div>
<div>div2</div>
div {
color：red;
}
分类
-
类选择器
- "."+"类名"找到标签
- 类选择器格式：. 类名
eg:
<p class="high">第一段文字</p>
<p>第二段文字</p>
<div class="high">div1</div>
<div>div2</div>
.high {
color：red;
}
结果：
结果.png
-
id选择器
- "#"+"类名"找到标签
- 类选择器格式：# 类名
eg:
<p id="first">第一段文字</p>
<p>第二段文字</p>
#first {
color：red;
}
结果：
结果.png
-
并列选择器
- "标签名"+“，”+".类名"找到标签
- 类选择器格式：标签名，.类名
eg:
<p class="high">第一段文字</p>
<p>第二段文字</p>
<div class="high">div1</div>
<div>div2</div>
div， .high {
color：red;
}
结果：
结果.png
-
复合选择器
复合选择器.png
-
后代选择器
后代选择器.png
-
直接后代选择器
直接后代选择器.png
-
相邻兄弟选择器
相邻兄弟选择器.png
-
属性后代选择器
属性后代选择器.png
