选择器

172 阅读2分钟

标签选择器

标签选择器是指用HTML标签名称作为选择器,按标签名称分类,为页面中某一类标签指定统一的CSS样式。

p{ 
    font-size: 12px; 
    color: #666; 
    font-family:"微软雅黑"; 
}

类选择器

基本语法格式:.类名{ 属性1:属性值1;属性2:属性值2;}

该语法中,类名即为HTML元素的class属性值,大多数HTML元素都可以定义class属性。

id选择器

id选择器使用**‘#’**进行标识,后面紧跟id名。

基本语法格式:#id名{ 属性1:属性值1;属性2:属性值2;}

该语法中,id名即为HTML元素的id属性值,大多数HTML元素都可以定义id属性,元素的id值是唯一的,只能对应于文档中某一个具体的元素。

通配符选择器

通配符选择器常用  ‘*’ 号表示,它是所有选择器里作用范围最广的,能匹配页面中所有的元素。

基本语法格式:*{ 属性1:属性值1;属性2:属性值2;}

并集选择器

并集选择器是同时匹配多个选择器,取多个选择器的并集,选择器之间用逗号隔开,如em,strong{ }。

语法格式: 标签名称1,标签名称2 { 属性1:属性值1;属性2:属性值2;}

后代选择器

后代选择器也称包含选择器,用来选择特定元素的后代。如.asideNav li{ },表示先匹配第二个选择器的元素,并属于第一个选择器内。

语法格式: 标签名称1 标签名称2{ 属性1:属性值1;属性2:属性值2;}

伪选择器

1.伪类选择器:

CSS提供了五种基本伪类选择器,分别对应HTML标记的五种状态。

伪类选择器作用应用对象
:hover定义标记在鼠标悬停(划过)时的样式所有显示标记
:link定义标记在超链接状态下的样式a标签
:focus定义标记在获取焦点时的样式a标签(IE浏览器不支持)
:visited定义标记被访问过后的样式a标签
:active定义标记在选定时刻下的样式a标签