这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天
昨天学习了一些基础的CSS操作，初步打开了CSS的大门，今天的笔记进一步加深对CSS的相关理解和认识。深入剖析CSS的相关进阶知识。
本课重点内容
- 优先级
- 盒子模型
- 块级元素&行内元素
- 三类排版（flex、float、grid）
- 定位（position）
今天的内容知识较为冗杂，需要多加消化吸收
课堂笔记
优先级相关
每一种选择器都有相应的优先级，优先级越高越被选择，优先级相同选后面。
继承与初始值
若自身未设置相应属性，会自动继承父元素的CSS属性
与文本相关的属性一般可以继承，其他的(如长宽）不能继承。
CSS的每一个属性都有初始值。
布局相关
盒子模型
- width、height表示长宽（高）
- padding表示内边距
- border表示边框（可设置宽度和方向颜色等）
- margin表示外边距
margin:auto可以使得水平居中overflow可以设置溢出内容不显示或者显示滚动条
块级元素&行级元素
可以用display属性来改变类型
三大经典排版方式
flex
可以控制盒子：
- 摆放流向（-> <- ↑ ↓）：
flex-direction - 摆放顺序：
flex-direction：设置为xx-reverse/order
- 盒子宽度和高度
4. 水平和垂直方向对齐：
justify-content、align-items
float
暂不介绍
grid
！可能不支持旧的浏览器 以网格形式来确定位置
定位
四大基本定位：
- static
- relative
- abusolute
- fixed
