标签：

水平居中的实现方法:

案例:

<div class="parent">

<div class="child">DEMO</div>

</div>　

方法1：inline-block+text-align

.child{display:inline-block;}

.parent(text-align:center;)

方法2：table+margin

.child{display:table;margin:0 auto;}

方法3：absolute+transform

.parent{position:relative;}

.child{position:absolute;left:50%;transform:translateX(-50%);}

方法4：flex+justify-content

.parent{display:flex;justify-content:center;}

或者：

.parent{display:flex;}

.child{margin:0 auto;}

（学习笔记）页面布局解决方案

标签：

原文地址：http://www.cnblogs.com/stephenxio/p/5789953.html