标签选择器
标签名 { css属性名:属性值; }
➢ 作用:通过标签名,找到页面中所有这类标签,设置样式
➢ 注意:
-
标签选择器选择的是一类标签,而不是单独某一个
-
标签选择器无论嵌套关系有多深,都能找到对应的标签
通配符选择器 *
结构: * { css属性名:属性值}
➢作用:找到页面中所有的标签设置样式
➢注意:开发中使用比较少,杀伤力太大
id选择器
结构:#id属性值{ css属性名:属性值 }
➢通过id 属性值可以找到页面中带有id 属性值的标签
➢注意:id属性值是唯一的不可重复一个标签只能有一个id属性值
类选择器
结构:.类名{css属性名:属性值}
➢作用:通过类名可以找到页面中所有带这个类名的标签
➢注意:类名可以由数字.字母. 中划线. 下划线组成,但不能以数组开头或者中划线开头。
一个标签可设置多个类名 类名可以重复
后代选择器 空格
结构: 选择器1 选择器2{css}
➢作用:在选择器1所找到标签的后代(子代.孙代.重孙代----)中。找到满足选择器2的标签。
➢注意:后代选择器与选择器之间用空格隔开
并集选择器: ,
结构:选择器1 , 选择器2 {css}
➢作用:找到选择器1和选择器2选中的标签
➢注意:并集选择器之间用 ,分割,
交集选择器:紧挨着
结构:选择器选择器2 {css}
➢作用:选中页面中同时满足多个选择器的标签
➢注意:交集选择器之间是紧挨着的不能分割,交集选择器中如果有标签选择器那么标签选择器必须写在前面。
hover伪类选择器
结构: 选择器:hover{css}
➢作用:选中鼠标悬停在元素上的状态
➢注意:伪类选择器选中的是元素的某种状态