2019 面试题

• margin: 0 auto;水平
• text-align: center;水平
• 行高，垂直
• 表格，center,middle；水平垂直
• display:table-cell；模拟表格，all
• 绝对定位，50%减自身宽高
• 绝对定位，上下左右全0，margin:auto
• 绝对定位加相对定位。不需要知道宽高
• IE6，IE7：给父元素设一个font-size:高度/1.14,vertical-align:middle

块格式化上下文, 特性:

• 使 BFC 内部浮动元素不会到处乱跑；
• 和浮动元素产生边界
• bfc 机制就是块及格式化上下文。一个独立的渲染区域，在里面操作不会影响外边的布局

• 标准模式: box-sizing: content-box; 宽高不包括内边距和边框;
• 怪异模式: box-sizing: border-box;

当父元素不给高度的时候，内部元素不浮动时会撑开, 而浮动的时候，父元素变成一条线, 造成塌陷.

• 额外标签法（在最后一个浮动标签后，新加一个标签，给其设置clear：both；）（不推荐）
• 父元素添加overflow:hidden; (触发BFC)
• 使用after伪元素清除浮动（推荐使用）
• 使用before和after双伪元素清除浮动
• #content:after{content:"";display:block;clear:both;}

• 比如antd的row和col, 将一行等分为24份, col是几就占几份, 底层按百分比实现; 结合媒体查询, 可以实现响应式