一、类型选择符
特点:
1.所有的html标签都可以用作类型选择符
2.可以选中当前结构里所有指定标签
例:
div{} //选中所有div标签
.nav a{} //选中class类名名为"nav"中的所有a标签
二、id选择符
特点:
1.具有唯一性,在一个页面中一个id类名只能对应一个标签 //通常用于搭建网页的外围结构
例:
<div id="nav"></div> //给div标签起了一个id类名
#nav{} //选中id类名为"nav"的标签
三、class选择符
特点:
1.一个元素可以有多个类名,多个元素也可以取同一个类名
2.可以制定一类样式 //需要制定相同样式的标签取同一个class类名
例:
<div class="nav-con box"></div> //给div标签起了两个class类名
.nav-con{} //选中class类名为"nav-con"的所有标签
四、群组选择符
特点:
1.将多个选择器以逗号作为分隔的方式组成一组进行统一的样式制定
例 :
#nav,.box,p{100px;} //将id类名为"nav"class类名为"box"和所有p标签的宽度制定为100像素
五、包含选择器
特点:
1.通过父元素确定所要制定的那个子元素
例:
.nav .box{height:100px;} //将class类名为"nav"中class类名为"box"的子元素的高度制定为100像素
六、伪类选择器
特点:
1.满足某个条件则制定某种样式
2.可用于制定"行为"
例:
a:link{color:#000;} //链接未访问时字体颜色为黑色
a:visited{color:#fff;} //链接已访问时字体颜色为白色
.box:hover{background:#ccc;} //在鼠标滑到class类名为''box''的标签所占据的空间里时标签背景颜色变为灰色
.box:active{100px;} //在鼠标处于''class''类名为box的标签所占据的空间中按下时标签高度变为100像素
七、通配符
特点:
1.可选中页面中的所有标签,通常用于制定统一样式
例:
*{margin:0;padding:0;} //将所有标签的外部间距和内部间距制定为0像素