css - 如何让那个wrapper水平居中垂直居中
本文介绍了css - 如何让那个wrapper水平居中垂直居中的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
很简单的布局
<html>
<head>
<style type="text/css">
div.wrapper{
width:1000px;
height:500px;
border:2px solid red;
}
</style>
</head>
<body>
<div class="wrapper">
<div>
</body>
</html>
div里面的内容省略了，如何将这个div.wrapper对html水平且垂直居中？
我要这样的效果
解决了水平居中，没有解决垂直居中。
<html>
<head>
<style type="text/css">
div.wrapper{
width:1000px;
height:500px;
border:2px solid red;
margin:0 auto;
}
</style>
</head>
<body>
<div class="wrapper">
<div>
</body>
</html>
解决方案
.wrapper {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
}这篇关于css - 如何让那个wrapper水平居中垂直居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
