1.标签选择器(选择同一类的全部标签)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/*
标签选择器会选择到页面上所有的这个标签都进行一样的操作
*/ h1{
color:red;
background: aquamarine;
border-radius: 24px;
}
p{
font-size: 80px;
}
</style>
</head>
<body>
<h1>我是标题</h1>
<h1>我也是标题</h1>
<p>我是段落</p>
</body>
</html>
2.类选择器（选择所有class属性一致的标签，可以跨标签使用）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>类选择器</title>
<style>
/*
类选择器的格式 .class{}
优点：可以把多个标签进行归类，从而实现对相同标签中的不同对象实现不同的操作，
也可以使不同标签进行相同的操作
*/
.class01{
color: aqua;
}
.class02{
color: darkmagenta;
}
.class03{
color: deeppink;
}
</style>
</head>
<body>
<h1 class="class01">我是标题</h1>
<h2 class="class02">我也是标题</h2>
<h3 class="class03">我还是标题</h3>
<p class="class01">
我跟他们不一样，我是段落
</p>
</body>
</html>
3.id选择器（全局唯一）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>id选择器</title>
<style>
/*
id 选择器 ： 和class不同，id必须保证全局唯一
语法：
#id名称{}
优先级：
不遵循就近原则，固定
id选择器 > class选择器 > 标签选择器
*/
#id选择器{
color: deeppink;
}
.类选择器{
color: aqua;
}
h1{
color: cornflowerblue;
}
</style>
</head>
<body>
<h1 id="id选择器">标题1</h1>
<h1 class="类选择器">标题2</h1>
<h1>标题3</h1>
<h1 class="类选择器">标题4</h1>
<h1 class="类选择器">标题5</h1>
<h1>标题6</h1>
</body>
</html>
优先级：id选择器 > class选择器 > 标签选择器