选择器和权重

数字加权计算。

盒模型

*{box-sizing: border-box}
标准模型和ie模型的区别。默认content-box

js如何获取宽高？

dom.currentStyle.width
window.getComputedStyoe(dom).width
dom.getBoundingClientReact().width 窗口位置。

BFC

边距重叠解决方案。margin合并
渲染规则：

• BFC垂直边距会重叠
• bfc区域不会和浮动重叠
• 独立容器，外界 不会
• 计算bfc高度，浮动不参与计算
  触发：
• float 值不为none
• position不是static relative
• dispaly table相关
• overflow
  使用场景：
  比如清楚浮动。可以设置floa overflow

float

圣杯，双飞翼

Q:左侧100px，右侧200px，中间自适应。

• 浮动。纯浮动，中间不需要指定宽度。left right center
• 绝对定位。中间 left right 指定数值。
• flex。 flex:1
• 表格布局 table-cell
• grid

定位

flex

重绘 回流

repaint reflow
重绘回流不可避免，我们优化的点是减少不必要的重绘回流
重绘，不脱离文档流，一些属性发生变化，比如颜色，背景等。
回流，DOM大小位置发生变化，浏览器需要重新渲染，或者全部重新渲染。

要进行优化，一般都是减少回流，比如先暂存DOM修改，一次性完成修改。