正文
css让div水平垂直居中
小程序：扫一扫查出行【扫一扫了解最新限行尾号】
复制小程序
示例1：.div1{
width:200px;
height:300px;
border:1px solid #000;
position: relative;
}
.div2{
width: 40px;
height:40px;
background:green;
position: absolute;
margin: auto;
top:;
left:;
right:;
bottom:;
}
示例1 css部分
<div class="div1">
<div class="div2">居中</div>
</div>
示例1 html部分
示例2：.div3{
width:200px;
height:300px;
border:1px solid #000;
display: table-cell;
vertical-align: middle;
}
.div4{
width: 40px;
margin: 0 auto;
}
示例2 css部分
<div class="div3">
<div class="div4">居中</div>
</div>
示例2 html部分
.div1{
width:200px;
height:300px;
border:1px solid #000;
position: relative;
}
.div2{
width: 40px;
height:40px;
background:green;
position: absolute;
margin: auto;
top:;
left:;
right:;
bottom:;
}
示例1 css部分
<div class="div1">
<div class="div2">居中</div>
</div>
示例1 html部分
.div3{
width:200px;
height:300px;
border:1px solid #000;
display: table-cell;
vertical-align: middle;
}
.div4{
width: 40px;
margin: 0 auto;
}
示例2 css部分
<div class="div3">
<div class="div4">居中</div>
</div>
示例2 html部分
