css选择器 1)类型选择符(标签选择符) 能选中左右同名标签 2) id选择器 用法: 用来划分网页外围结构 语法: <标签 id=“名称”> </标签> #名称{ 属性:属性值} 3)类选择器(class选择器) 语法:<标签 class="名称"> </标签> .名称{ 属性:属性值} 4)群组选择器 当有多个选择符应用相同的样式时,可以将选择符用“,”分隔的方式,合并为一组。 语法:选择符1,选择符2, 选择符3{属性:属性值;} 实例:.top, #nav, p{width:100px;} 5)包含选择符 选择符1和选择符2用空格隔开,含义就是选择符1中包含的所有选择符2; 语法:选择符父级 选择符子级{属性:属性值;} 实例: div ul li{height:200px;} 6)伪类选择符
a:link 未访问的链接状态
a:visited 已访问的链接状态
a:hover 鼠标滑过链接的状态
a:active 鼠标按下的状态
7)通配符 通配选择符的写法是“”,其含义就是所有标签; 表示该样式适用所有网页元素; * 语法:{属性:属性值;}* 例:*{margin:0;padding:0;}
起名规范:尽量小写字母开头
不能出现中文及特殊字符
使用字母,数字,下划线,连字符
不能出现关键字
选择符的权重 内联样式(1000)>id选择器(100)>class选择器/伪类(10)>标签(1)>*(0) 群组选择器的权重是他本身 如果权重相同时,后写的会覆盖掉之前的
css层叠性
css层叠指的是样式的优先级,当产生冲突时以优先级高的为准。
1,important最先执行
2,内联样式>内部/外部
内部样式和外部样式:看书写顺序,写在后面的会覆盖掉前面的
3,看选择器的权重 4,开发者模式>用户模式>浏览器模式 5,当权重相同时,后写的样式会覆盖掉前面的