1.标签选择器

<style>
div {
border: 5px solid blue;width: 500px;height: 200px;color: burlywood;
}
<div class="font32">我是⼀个div, class为font32</div>

所有的div标签都会被设置成上述设置的式样

2.class选择器

<style>.font32 {color: red;font-size: 32px;border: blue 5px solid ;width: 500px;height: 200px;margin: 10px;/* padding: 20px; */padding-left: 20px;}</style>
<div class="font32">我是一个div, class为font32</div><div class="font32">我是一个div, class为font32</div>

需要在类之前加上".",来选择所有的类.从而进行渲染

3.id选择器

<style>
#sd{color: red;font-size: 32px;border: blue 5px solid ;width: 500px;height: 200px;margin: 10px;/* padding: 20px; */padding-left: 20px;}
</style><div  id="sd">我是一个2b class为font32</div>

id选择器需要再id的值前面加上#,来选择进行渲染

4.复合选择器

<style>
.order li {color: purple;}
</style><div class="order"> 我是一个div,class为order </div>
<li> 我是一个li</li>

复合选择器需要两种即两种以上的标签来进行选择,通常多种标签之间以空格隔开即可

5.通配符选择器

<style>*{color:red
}
</style>

使用*来确保选择所有的标签,全部进行渲染