css如何垂直居中

css

1139

2021/3/24 14:39:47

栏目: 编程语言

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

css如何垂直居中

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

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

页面布局：

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

css样式：

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

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

页面布局：

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

css样式：

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

最新知识库