1.左右布局

image.png

2.左中右布局

image.png

3.水平居中

image.png

4.垂直居中

image.png

5.其他小技巧

鼠标悬浮某个元素，元素底部边框出现变颜色有抖动，可以提前给元素底部边框加上透明的颜色和大小粗细border-bottom: 3px solid transparent;

一个元素被设置成display: inline-block;,这个元素底部会有缝隙，去除缝隙，只要加上vertical-align: top;就可以解决