<body>
<div><div>
</body>
一:子集宽高确定
方法1
body{
position:relative;
}
div {
position:absolute;
width:200px;
height:200px;
top:50%;
left:50%;
margin-left:-100px;
margin-top: -100px;
background: #1F487C;
}
方法2
body{
position:relative;
}
div{
position: absolute;
top:0;
bottom: 0;
left: 0;
right:0;
margin: auto;
width:20%;
height:20%;
background: #1F487C;
}
二:子元素宽高不确定
body{
position:relative;
}
div{
position:absolute;
left:50%;
top:50%;
transform: translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
-o-transform:translate(-50%,-50%);
}
方法有很多,以后会慢慢填充新的方法。
网友评论