左右布局：
左右布局一般使用浮动就可以。两个左浮或者一个左浮一个右浮，父级清除浮动；
左中右布局：
也可以采用浮动来实现，如果要自适应；可以采用浮动加定位来实现，如双飞翼布局；

水平居中：
内联元素：在父级加text-align:center;
块元素：在自身设置：margin:0 auto;
多个块元素：
1，子元素宽度固定，设置display: inline-block;父级设置text-align:center;
2，子元素宽度固定，设置margin:0 auto;
2，父级设置display: flex; justify-content: center;

垂直居中：
内联元素之单行文本：
1，在父级加line-height
2，在父级加padding：10px 0
3，在父级加line-height和padding：10px 0
内联元素之多行文本：
1, 父级加display: table-cell;
height;
vertical-align: middle;
2,父级加display: flex;
align-items:center;

块级元素：
1，在父级加padding：10px 0;
2，父级加position:relative;
垂直元素加position：absolute;
top:50%;
height:100px;
margin-top:-50px
3，不固定高度的情况下：
父级加position:relative;
垂直元素加position：absolute;
top:50%;
transform:translateY(-50%)
4，display: flex;
justify-content: center;
align-items:center;