css垂直居中技巧总结
Posted zhangshengwang
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css垂直居中技巧总结相关的知识,希望对你有一定的参考价值。
1、Line-height + inline-block
<div class="box box2">
<div class="content">
立马来看实际完成的
效果吧!別忘了拖拉一下窗口看看 RWD 效果喔! </div>
</div>
h2{
text-align: center;
}
.box{
width: 500px;
border: 1px solid #f00;
margin: auto;
line-height: 200px;
text-align: center;
}
.box2 .content{
display: inline-block;
height: auto;
line-height:1;
width: 400px;
background: #ccc;
}
以上是关于css垂直居中技巧总结的主要内容,如果未能解决你的问题,请参考以下文章