css基础知识
1、css定义:层叠样式表,用来美化页面
2、写法分类
1)内联(行内):
写在标签里面,以属性的形式表现,属性名:style
<div style="color: red;"></div>
此种写法不推荐使用
2)内嵌:
写在<head>里面,以标签的形式表现,标签名:style
<style></style>
3)外部引用:
样式写在一个.css文件里面,通过引用加载到页面中,
写在<head>里面,以标签的形式表现,标签名:link
<link rel="stylesheet" href="common.css"/>
3、样式格式
样式属性名:样式值;样式属性名:样式值;……
4、选择器
4.1作用:找标签
把样式应用到指定的标签上
4.2格式:
选择器{
样式属性名:样式值;样式属性名:样式值;……
}
4.3常用选择器
1)通用选择器:*
2)标签选择器:标签名
3)id选择器:#id值
4)class选择器:.class
5) 属性选择器:选择器[属性名=”属性值”]
6)并列选择器:多个选择器分为一组,用逗号分隔,同时设置样式
7)后代选择器:选择器 选择器
8)子元素选择器:选择器>选择器
5、优先级
1) 规则1: 最近的祖先样式比其他祖先样式优先级高。
2) 规则2:"直接样式"比"祖先样式"优先级高。
3) 规则3:优先级关系:内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器
4) 规则4:计算选择符中 ID 选择器的个数(a),计算选择符中类选择器、属性选择器以及伪类选择器的个数之和(b),计算选择符中标签选择器和伪元素选择器的个数之和(c)。按 a、b、c 的顺序依次比较大小,大的则优先级高,相等则比较下一个。若最后两个的选择符中 a、b、c 都相等,则按照"就近原则"来判断。
4) 规则5:属性后插有 !important 的属性拥有最高优先级。若同时插有 !important,则再利用规则 3、4 判断优先级。