(1)使用margin
margin:0 auto
text-align:center;//需要加IE hack
(2)使用定位和负margin;
wrapper{
position: relative;
left:50%;
margin-left: -350px;
width: 700px;
top:50%;
background-color:blue;
}
(3)使用弹性盒子flexbox
body{
display: flex;
justify-content: center; //水平居中
align-items: center; //垂直居中需要设置容器的高度值
}
网页居中布局技巧
本文介绍了三种实现网页元素居中的方法:使用margin属性、结合定位与负margin以及利用弹性盒子flexbox特性。这些方法适用于不同场景,帮助开发者轻松实现元素的水平及垂直居中。
975

被折叠的 条评论
为什么被折叠?



