css如何垂直居中

lewis 2019-04-07 21次阅读

在css中设置垂直居中的方法：1.使用line-height属性设置垂直居中；2.使用verticle-align属性设置垂直居中；

在css中设置垂直居中的方法

1.使用line-height属性设置垂直居中

页面布局：

<body><divid="out">
<divid="in"></div>
</div>
</body>

css样式：

#in{height:100px;
line-height:100px;
border:solid1px#333;
}

2.使用verticle-align属性设置垂直居中

页面布局：

<body><divid="out">
<divid="in"></div>
</div>
</body>

css样式：

#out{width:600px;
heigth:300px;
}
#in{
width:50%;
height:50%;
display：inline-block;
vertical-align:middle;
}

◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。