css的三大特性
-
继承性:子元素继承父元素样式主要是跟文字相关的样式继承。
-
层叠性:后面样式会覆盖前面样式,主要解决样式冲突问题。但是要看选择器权重来确定优先级
-
优先级:优先级由选择器的 权重 决定,权重高的规则覆盖权重低的规则
css的优先级
- 原则:1. 优先级相等的时候,CSS 中最后的那个声明的样式将会被应用到元素上。(层叠遵循就近原则)2. 其余判断那个选择器权重高,优先执行那个样式。3. 权重是4位一组,是分开的层级,不能进位。
- 权重
- 权重计算举例
盒子模型
- 分类
- 盒子模型的组成
- 盒子模型的组成——边框
- 盒子模型的组成——内边距
- 盒子模型的组成——外边距
- 盒子模型的组成——外边距实现水平居中
- 盒子模型的组成——外边距折叠
- 盒子模型的组成——外边距塌陷
.father {width: 150px;height: 150px;background-color: pink;// 1. 给父盒子添加上边框。(父盒子本身有边框则不会出现问题)//border: 1px solid #000;// 2. 给父盒子添加上内边距。(同理)//padding-top: 20px;//3. 给父盒子添加: overflow: hidden; 属性overflow: hidden; }
-
盒子模型的尺寸计算
-
盒子背景
//不是针对当前元素,而是针对的是当前视口
background-attachment: fixed
-
背景渐变
-
盒子阴影
-
过渡
-
样式初始化
-
字体图标
-
css精灵图技术