首页 > 代码库 > CSS-选择器
CSS-选择器
一、基本选择器
1、标签选择器:选择给哪个标签加样式,自动指向该标签
语法:标签选择器{属性名:属性值;属性名:属性值;}
body{ } p{ } div{ }
2、类选择器:给一类html标签添加样式
语法:类选择器{属性名:属性值;属性名:属性值;}
选择器名自己定义,例如<div class="div1"></div>
.div1{属性名:属性值;属性名:属性值;}(注意引用的时候选择器名前面加.)
3、id选择器:给特定的html标签添加样式
语法:id选择器{属性名:属性值;属性名:属性值;}
选择器名自己定义,例如<div id="div1"></div>
#div1{属性名:属性值;属性名:属性值;}
(注意引用的时候选择器名前面加#,id通常给javascript使用,不建议重复)
4、通用选择器:给所有标签添加样式
语法:*{属性名:属性值;属性名:属性值;}
二、复合选择器
1、多元素选择器:多个标签共有的属性和属性值放到一起
语法:选择器,选择器,选择器,...{属性名:属性值;属性名:属性值;}
2、后代元素选择器:
语法:选择器1 选择器2 选择器3{属性名:属性值;属性名:属性值;}
例如:<div class="num1">
<ul class="num2">
<li class="num3"></li>
</ul>
</div>
.num1 .num2 .num3{属性名:属性值;属性名:属性值;}(为num1里面的num2里面的num3添加样式)
3、子元素选择器
语法:选择器>选择器{属性名:属性值;属性名:属性值;}(某个标签的第一层元素)
CSS-选择器