CSS常用选择器分为如下几类
1、元素选择器/类选择器(选择某一类元素 如:div p h等标签)
用法 元素名称{属性:属性值}
div{width:200px;height:100px;}
2、通配符(就是选择所有元素,即对整个文档或文档中所有元素进行选择)
用法 *{属性:属性值}
示例如下,设置整个页面的背景颜色为灰色
*{background:grey}
说明:通常不建议使用,因为选择的元素太多,影响效率
3、id选择符(给id 添加属性和id名)
用法:#id名称{属性:属性值}
示例如下,给id为div2的元素设置背景为pink
<style>
#div2{background:pink;}
</style>
<div id="div2">div2</div>
说明:id选择器具有唯一性,即一个文档中只允许有唯一的一个id名称
4、class选择符(给一个或多个元素添加class属性进行归类)
用法:.class名称{属性:属性值}
示例如下,给class名为caption的元素统一设置字体大小以及颜色
<style>
.caption{color:mediumblue;}
</style>
<h3 class="caption">h3</h3>
<h4 class="caption">h4</h4>
5、群组选择符(同时给多个选择符设置同一个样式)
用法:div,.hehe,p,#top{属性:属性值}
示例如下,对id:div2和p统一设置颜色和字体大小
<style>
#div2,p{color:yellow;font-size:30px;}
</style>
<p>pppp</p>
<div id="div2">div2</div>
6、后代选择器(最常用的选择器,用于选择后代元素 中间用空格隔开)
用法:选择符1 选择符2 选择符n{属性:属性值;}
示例如下,对div中的无须列表ul中的内容li设置字体颜色
<style>
div ul li{color:orange;}
</style>
<div>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
扩展尝试 选择符叠加
8、多个选择符可以叠加使用 例:一个div有id还有class
div#id.class{属性:属性值;}