1.标记选择器
p{
color: aliceblue;
}
*:表示所有元素
2.类别选择器
.one{
color: aqua;
}
.two{
text-align: center;
}
调用
<p class="one"></p>
/*
同时使用多个
*/
<p class="one two"></p>
3.ID选择器
#one{
text-align: center;
}
<p id="one two"></p>
4.交集选择器
p.two{
text-align: center;
}
<p class="two"></p>
/*
此时 p class为two的设置样式
*/
p#two{
text-align: center;
}
<p id="two"></p>
/*
此时 p id为two的设置样式
*/
5.并集选择器
h1,p,span{
text-align:center;
}
6.后代选择器
/*
p标签且class为one下面的 li的样式
*/
p .one li {
color: black;
}
6.伪类选择器
E:link 向未访问的超链接设置样式 仅限于<a>标签
E:visited 向已访问的超链接设置样式 仅限于<a>标签
E:hover 向鼠标悬停的到某个元素设置样式,任意元素
E:active 向被用户激活的元素设置样式,任意元素 显示时间短
E:focus 向获取焦点的元素设置样式
E:first-child E元素作为其他元素的第一个子元素
E:last-child E元素作为其他元素的最后一个子元素
7.伪元素选择器
E::伪元素{属性1:值1}或者E:伪元素{属性1:值1}
(1)E::first-letter 设置元素E内的第一个字符的样式
(2)E::first-line 设置元素E内的第一行字符的样式,常用于<p>标记