CSS 常用选择器

CSS 常用选择器

1.id选择器

#i1{
	background-color: #2459a2
	height:80px
}

2.class选择器

.i1{
	background-color: #2459a2
	height:80px
}
<div class="i1"></div>

3.标签选择器

div{
	background-color: #2459a2
	height:80px
}
<div></div>

4.层级选择器(空格)

.c1 span{
	background-color: #2459a2
	height:80px
}
<div class="c1" >
	<span>fff</span>
</div>

5.组合选择器（逗号）

#i1,.c1,div{
	background-color: #2459a2
	height:80px
}
<div id="i1" >2022-11-03 21:33:05 星期四</div>
<div class="c1" >2022-11-04 21:33:05 星期五</div>
<div>2022-11-05 21:33:05 星期六</div>

6.属性选择器（对选择到的标签再通过属性进行一次筛选）

.c1[a="justin"]{
	background-color: #2459a2
	height:80px
}
<div id="i1" >2022-11-03 21:33:05 星期四</div>
<div class="c1" a="justin">2022-11-04 21:33:05 星期五</div>
<div class="c1">2022-11-05 21:33:05 星期六</div>

等等....