用一种方式把你想要的那个元素选中，只有把他选中了，你才可以为这个元素添加CSS样式
不同的方式就是不同的选择器，选择器的不同，在于选择方式的不同，但目的是一样的，就是选中想要的元素才可以定义该元素的CSS
常用的5种选择器
元素选择器 ：选中相同的元素，然后给相同的元素定义同一个CSS样式
id选择器 ：为元素设置id,为设置id的元素定义CSS样式，同一个页面不许出现相同的id,就像没有两个人的身份证号是一样的 ，不同的页面可以有相同的id
class选择器 :类选择器，对 或 同的元素 定义相同的CSS样式
后代选择器 :选择元素内部中所有的某一种元素，包括子元素和其他后代元素（孙元素） ，父元素和后代元素必须用空格隔开，从而表示某个元素内部的后代元素
群组选择器 :同时对几个选择器进行相同的操作，两个选择器之前必须用英文逗号隔开
id 选择器要加 “#“号前缀 ，class选择器要加"."前缀
每一个样式声明后都要用 分号 来表示一个声明的结束
例子：元素选择器
/*把页面中所有的div元素选中，并定义文本颜色为红色 */
div{color:red;}
<!-- 元素选择器 -->
<div>我的网站</div>
<p>我的网站</p>
<span>我的网站</span>
<div>我的网站</div>
<div>我的网站</div>
例子：id选择器
<style>
/*选中id 为love的元素，并定义文本颜色为绿色 */
#love{color:green;}
</style>
</head>
<body>
<!-- id选择器 -->
<div>我的网站</div>
<p>我的网站</p>
<span id="love">我的网站</span>
<div>我的网站</div>
<div>我的网站</div>
</body>
例子：class选择器
<style>
/*选中设置相同元素和不同元素 拥有同一个class的元素设置样式为蓝色 */
.myName{color:blue;}
</style>
</head>
<body>
<!-- class选择器 -->
<div class="myName">我的网站</div>
<p>我的网站</p>
<span class="myName">我的网站</span>
<div>我的网站</div>
<div class="myName">我的网站</div>
</body>
例子：后代选择器
<style>
/* 选中id为father1的元素下所有的div元素，定义文本颜色为粉色 */
#father1 div{ color:pink;}
</style>
</head>
<body>
<!-- 后代选择器 -->
<div id="father1">
<div>我的网站</div>
<div>我的网站</div>
</div>
<div id="father2">
<p>我的网站</p>
<p>我的网站</p>
<span>我的网站</span>
</div>
例子：群组选择器
<style>
/*对几个不同的选择器进行相同的操作，设置文本颜色为玫红色，选择器之间必须用逗号隔开 */
.myName,#love,span{color:purple;}
</style>
</head>
<body>
<!-- 群组选择器 -->
<div class="myName">我的网站</div>
<p id="love">我的网站</p>
<span>我的网站</span>
<div>我的网站</div>
<div>我的网站</div>
</body>