核心提示：本文主要介绍如何使元素居中显示的几种方法，当然方法有很多，现在记录的不过是笔者目前能够想到的几种：定位、table-cell、增加空span、弹性盒模型。html样式如下：css样式如下：.box{w...
本文主要介绍如何使元素居中显示的几种方法，当然方法有很多，现在记录的不过是笔者目前能够想到的几种：定位、table-cell、增加空span、弹性盒模型。
html样式如下：
css样式如下：
.box{
width:600px;
height:600px;}
类名为.box1的p宽高未定。
方法一(定位）
.box{
width:600px;
height:600px;
position:relative;
}
.box1{
position:absolute;
left:50%;
top:50%;
transfrom(-50%,-50%);
}
方法二（table-cell）
.box{
width:600px;
height:600px;
display:table-cell;
text-align:center;
vertical-align:middle;
}
.box1{
display:inline-block;
vertical-align:top;
}
方法三（给box中增加一个空span）
.box{
width:600px;
height:600px;
}
.box span{
display:inline-block;
vertical-align:middle;
height:100%;
}
.box1{
display:inline-block;
vertical-align:middle;
}
方法四(弹性盒模型）
.box{
width:600px;
height:600px;
display:flex;
justify-content:center;
align-items:center;
}
