1.左右布局
（1）用浮动float实现左右布局。给左盒子添加float:left；(向左浮动)，给右盒子添加float:right；(向右浮动)；但是加了浮动效果，同时就要给左右盒子的父级盒子加上class名为clearfix，clearfix::after{content:''; display:block; clear:both;}
（2）用左浮动float:left+外边距margin实现左右布局。给左边盒子设置右边距margin-right，或者给右边盒子设置左边距margin-left
（3）用绝对定位position:absolute实现左右布局。给左右盒子的父级加相对定位position:ralative，给左右盒子加绝对定位position:absolute，同时设置top，left，bottom，right样式属性
2.左中右布局
用浮动实现左中右布局。同上1（2）和1（3）的方法
3.水平居中
内联元素要居中，需要在其父级元素上加css样式text-align：center；
块级元素要居中，可在其本身上加css样式margin：0 auto；
（1）使用inline-block 和 text-align实现
（2）使用margin:0 auto来实现
（3）使用绝对定位实现
（4）使用flex布局实现
4.垂直居中
一般把高度height和行高line-height设置为相同，但是这样操作一般不是正居中；这样的话就用另外一种方式给该元素添加相同的上下内边距padding-top、padding-bottom，然后再去量该元素的整个高度并将行高line-height设置为量出来的高度的值
5.其他小技巧
（1）css中给属性加了display：inline-block；就同时要加vertical-align：top；
因为添加了display：inline-block；容易出现bug，而加vertical-align：top；可以消除这些bug，或者说可以消除hug的出现
（2）给阴影加上过渡时间就不会显得很突兀，transition：shadow 0.2s；
网友评论