CSS3实现图片在DIV中上下左右居中
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS3实现图片在DIV中上下左右居中</title>
<style>
.container{width:600px;height:600px;border:1px solid red;position: relative;}
.box{
padding: 20px;
background:orange;
color:#fff;
position:absolute;
top:50%;
left:50%;
border-radius: 5px;
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
}
</style>
</head>
<body>
<div class="container">
<div class="box">
上下左右居中
</div>
</div>
</body>
</html>