前端面试经典问题:CSS中居中的几种方式

1.水平居中的margin:0 auto

关于这个，大家肯定不陌生，这个是用于块级元素上。

 

2.水平居中 text-align:center

img的display:inline-block,类似的行内元素可以在父元素上添加效果让它进行水平居中

 

3.水平垂直居中（一）定位需要定位的元素的margin减去宽高的一半。

这种方法的局限性在于必须知道需要垂直居中的元素的宽高才能实现，在实战中也经常使用这种方法

 

 

4.水平垂直居中（二）定位和margin：auto；

这个方法也很实用，不用受到宽高的限制，很好用

 

5.水平垂直居中（三）绝对定位和transfrom

这个方法比较高级了，用到了形变，据我所知很多大神喜欢用这个方法进行定位，逼格很高的，学会后面试一定要用，这个是不需要知道元素的宽高就可以实现。对transfrom不了解的可以查询相关资料。