# 水平居中方案
# 方案一：text-align + inline-block
<div id="parent1">
<div class="child">水平居中</div>
</div>
@前端进阶之旅: 代码已经复制到剪贴板
#parent1{
text-align: center;
background:#ddd;
margin-bottom:20px;
}
#parent1 .child{
display: inline-block;
background:#666;
color:#fff;
}
@前端进阶之旅: 代码已经复制到剪贴板
# 方案二：margin：0 auto
<div id="parent2">
<div class="child">水平居中</div>
</div>
@前端进阶之旅: 代码已经复制到剪贴板
#parent2{
text-align: center;
background:#ddd;
margin-bottom:20px;
}
#parent2 .child{
display: table;
margin: 0 auto;
background:#666;
color:#fff;
}
