[英]how to align an image to the center of the div?
我试图将div中的图像对齐到中心。 我试过以下但是没有用。 请告诉我如何解决这个问题。 提前致谢。
<div class="erabox"><img src="indicator2.gif" alt="1910 to 1919" width="229" height="38" /></div>
<div class="erabox" style="text-align:center"><img src="indicator2.gif" alt="1910 to 1919" width="229" height="38" /></div>
只需要div标签中的style="text-align:center"
。
尝试使用以下CSS代码。 它使您的<img>
水平对齐中心并垂直对齐。
.erabox{
width:200px;
height:200px;
display:table-cell;
text-align:center;
vertical-align:middle;
}
只需使用保证金自动:
.erabox img {
display: block;
margin: auto;
}
在CSS中尝试下面的代码。 它肯定会对齐=“absmiddle”
CSS
.erabox{
position:relative;
}
.erabox img{
position:absolute;
top:50%;
left:50%;
margin-top:-19px; /* Half of images height */
margin-left:-115px; /* Half of images width */
}
如果.erabox div的宽度和高度是固定的,或者至少它的高度和宽度总是肯定大于图像,你可以使用图像作为背景
HTML
<div class="erabox"></div>
CSS
.erabox{
background:url("indicator2.gif") no-repeat;
background-position:50% 50%;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.