px、em、rem、vw、vh有什么区别？
基本概念
px：就是像素pixel的缩写
em：是相对单位，1em等于当前元素的 1font-size 的大小
rem：是CSS3新增的相对单位，1rem等于html的 1font-size 大小
vw和vh：是相对单位，1vw是视口宽度1%，1vh是视口高度的1%
什么是视口？
视口 ≠ 屏幕大小，视口去掉浏览器头尾
对CSS选择器优先级的理解
常用的CSS选择器
id、class、标签、伪类、通配
选择器优先级的计算方式
- important! > 行间样式 > id > class > 标签 > 通配
- 注意：继承的优先级永远没有直接给的优先级高 伪类=class
CSS哪些样式是可以继承的？
line-height需要注意的事项
line-height: 200px 直接继承
line-height: 1.5 根据自己的字体大小计算
line-height:200% 根据父级的字体大小计算
对BFC的理解
首先需要了解什么是BFC
BFC 是 Block Formatting Context （块级格式上下文）的缩写
BFC是一个独立的空间，里面子元素的渲染不影响外面的布局
BFC他的作用是什么
1、解决margin塌陷
2、清除浮动
如何触发BFC
- overflow: hidden
- display: inline-block / table-cell / flex
- position: absolute / fixed
对盒子模型的理解
首先肯定是需要知道什么是盒子模型
盒子模型就是元素在网页中实际占据的大小
盒子模型的计算方式
盒子模型 = width/height+padding+border 注意：没有margin
box-sizing
当box-sizing的值为 border-box 时，会改变盒子模型的计算方式
盒子模型 = width/height = 内容宽高+border+padding
offsetWidth
JavaScript中获取盒子模型的方式是 obj.offsetWidth / offsetHeight
