标签选择器
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只能指定唯一一个元素。
如图:
除了以上常见的选择器,还有子代.后代.相邻的选择器等写法
其他选择器
/* 除了常见的选择器,还有子代.后代.相邻的选择器等写法 */
div>p{
c