CSS总结：让元素居中的方法

一、text-align:center;

这个是没有浮动的情况下，我们可以先将要居中的块级元素设为inline/inline-block，然后在其父元素上加上属性text-align:center;即可。如果要居中的块级元素直接是内联元素（span、img、a等），直接在其父级元素上加上属性text-align:center;即可；

二、margin:0 auto;

前提：居中的元素必须是块级元素，如果是内联元素，需要添加属性display:block;而且元素不浮动。

三、绝对定位+偏移(已知宽高，需计算偏移值);

.way {
   
    position: relative;
    width: 250px;
    height: 250px;
}

.way img {
   
    width: 200px;
    height: 140px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -100px;
    margin-top: -70px;
}

兼容性好; 缺点:必须知道元素的宽高

四、绝对定位(四个方向都为0)+margin:auto;

.way4 {
   
    position: relative;
    width: 250px;
    height: 250px;
}

.way4 img {
   
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto