我有一个形象,是在一个锚元素。
I have an image that's in an anchor element.
我想要的锚的图象要在父分区垂直和水平居中。
I want the anchor an the image to be centered both vertically and horizontally in the parent div.
这里的一个例子:
<div class="wrapper">
<a href="#" class="anchor">
<img src="http://bit.ly/1mFH8AW"></img>
</a>
</div>
.wrapper {
background: black;
width: 500px;
height: 500px;
}
.anchor {
}
.anchor > img {
height: 100px;
width: 100px;
}
结果:
添加的位置是:相对
来您的包装,然后将图像的CSS更改为:
Add position:relative
to your wrapper and then change the image's CSS to:
.anchor > img {
height: 100px;
width: 100px;
position:absolute;
margin:auto;
top:0;right:0;bottom:0;left:0;
}
的jsfiddle例如
jsFiddle example