技术问答css如何垂直居中 - 扬州沐宇科技

扫描二维码下载沐宇APP

微信扫码使用沐宇小程序

沐宇首页互联网技术知识问答 css如何垂直居中

扬州沐宇科技

2021-03-24 14:39:47

css

在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;
}

上一条：css中如何引用图片