本文介绍了一种利用相对定位实现一个div元素在其父级div元素内水平垂直居中的方法，并提供了具体的HTML和CSS代码示例。
css中div在另一个div水平垂直居中问题
css中水平居中相对垂直居中来说比较好实现，一般只需要设置margin-left,margin-right这两个属性，
margin-left:auto;
margin-right:auto;以上两行代码就可以使当前的div处于水平居中，对于垂直居中，如果是相对怎个页面来说，可以用一下实现
margin:50% auto;当然如果你想让一个div在另一个div水平垂直居中的话，以上的代码是不行的。
我们需要用其他方式实现，这里我提供一个方法，使用相对定位来实现的，以下为具体实现方式：
html代码：
<html>
<body>
<div class="container">
<div class="box"></div>
</div>
<body>
<html>css代码：
.container{
width:200px;
height:200px;
background-color:red;
margin:50% auto;
}
.box{
width:100px;
height:100px;
position:relative;
left:50px;
top:50px;
}
以上代码就可以实现在一个div中的水平垂直居中了，大家可以根据自己的需求对参数进行调整，这里只是给大家一个思路！
扫一扫
1222
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
