1.inline-block+text-align
如果不希望元素内的文字水平居中，那么需要在child中设置text-align为left。
2.table+margin
3.absolute+transform
子元素不会对其他元素造成影响
4.flex+justify-content
只需要设置父元素
二：垂直居中（父容器和子容器的高度都是不一定的）
1.table-cell+vertical-align
兼容性比较好
2.absolute+transform
子元素不会干扰其他的元素。
3.flex+align-items
只需对父元素进行设置。
三、居中（父容器和自容器的大小都是不确定的）
1.inline-block+text-align+table-cell+vertical-align
2.absolute+transform
3.flex+justify-content+align-items
绝对居中
用到的平移
四、多列布局（一列定宽，另一列自适应）
1.float+margin
清除浮动时会出现问题
改进方案--清除浮动之后就不会出现问题
2.float+overflow
3.table
4.flex
五、多列布局（一列不定宽，另一列自适应）
1.float+overflow
2.table（将table-layout：fixed删除）
六、全屏布局（有固定区域也有自适应区域）
2.flex（css3新出现的概念）
flex-direction不设置时默认值为row，水平方向。 如果需要每个模块都自适应，通过里面的内容来撑起宽高，则删除代码中的高度设置就行。
七、响应式
宽度设置为设备宽度；初始缩放为1，用户不能手动缩放。
2.媒体查询（防止手机屏幕太小布局发生变化）
网友评论