超出容器高度的图片垂直居中，图片高度不定
最简单办法，将图片作为容器的background-img，background-position:center
实现这个居中
另外一种方法使用CSS3 的transform translation -50% 的方法
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="gbk">
<style type="text/css">
.myImg {
position: relative;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.content {
height: 100px;
width: 490px;
border: 1px solid black;
overflow: hidden;
}
</style>
</head>
<body>
<div id="content" class="content">
<img src="XXXXXXXXXX" class="myImg">
</div>
</body>
</html>
页:
[1]