如何让一个元素既能水平居中，又能垂直居中，在我们工作中是会经常碰到的，如实现下图的效果：
2020-08-21_093049.png
一下有两种办法可以实现，而且比较简单：
方法1 ：定位：
<style>
div{
width:400px;
height:400px;
background:red;
position: relative;
margin:100px 0 0 100px;
}
p{
width:200px;
height:200px;
background:cornflowerblue;
position: absolute;
top:100px;
left:100px;
}
</style>
<body>
<div>
<p> </p>
</div>
</body>
方法二、使用css3位移的方式：
<style>
div{
width:400px;
height:400px;
background:red;
}
p{
width:200px;
height:200px;
background:cornflowerblue;
transform: translate(100px,100px);
}
</style>
<body>
<div>
<p></p>
</div>
</body>
网上还有很多的方法，如有问题，欢迎指出！！！！！
网友评论