【前端学习整理】CSS（2）：CSS的选择器

标签选择器

div{
   width: 200px;height:200px;background: #FF0000;}

div就是上面这段css代码的选择器，意思是选择HTML文档中所有的div元素应用text-align:center属性。

当然，这只是选择器的一种，一般的页面会有许多html元素，需要用更简化方便的选择器来区分开来他们的不同和相同。
常用的选择器有

class选择器,id选择器,标签选择器

上面这种属于标签选择器，它选择了h1标签。

class选择器

.demo_one{
   font-size:14px;color:red;}
/* 使用class选择器写法为"."+class名称选中指定元素 */

使用class选择器写法为"."+class名称选中指定元素

<p class="demo_one">class选择器</p>
		<!-- 使用class属性给元素命名，该名可以被class选择器选中。 -->

使用class属性给元素命名，该名可以被class选择器选中
如图：

id选择器

#demo_two{
   font-size:16px;color: aqua;}
/* 使用id选择器写法为"."+id名称选中指定元素 */

使用id选择器写法为"."+id名称选中指定元素

<p id="demo_two">id选择器</p>
<!-- 使用id属性给元素命名 使用,一个元素也可以有多个class名,而id只能指定唯一一个元素。 -->

使用id属性给元素命名,一个元素也可以有多个class名,而id只能指定唯一一个元素。
如图：

除了以上常见的选择器,还有子代.后代.相邻的选择器等写法