首页 > 代码库 > Css 居中
Css 居中
若果position为relative,元素没有脱离文档流,则可以用
.center {
position:relative;
margin: auto;
}
来达到水平居中。
但是要达到垂直居中,这样是不行的,因为在没有脱离文档流的情况下,margin-top: auto;和margin-bottom: auto;实际都是0
所以可以参考以下方式
.center {
width: 900px;
height: 900px;
position: absolute;
margin: auto;
left: 0; top: 0; right: 0; bottom: 0;
}
默认情况下,块级元素的width默认是100%,所以会填充父元素,要看到有居中的效果,那么就要让元素不充满整个父元素,写上margin:0 auto;让其自动计算两边的margin距离。
参考:Absolute Horizontal And Vertical Centering In CSS
Css 居中
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。