垂直對齊的中心圖像
[英]Center Image with Vertical Align
問題描述
對於我來說，圖像不會像垂直對齊那樣居中對齊，似乎應該如此。 我僅在怪癖模式下為IE7編碼（不幸的是）。 我的代碼如下。 任何人都知道為什么這不會垂直對齊
<html>
<head>
</head>
<body>
<div style="height:500px; width 500px; line-height:500px; background-color:Green; vertical-align:middle;">
<img src="./images/load.gif" style="vertical-align:middle;"/>
</div>
</body>
</html>
2 個解決方案
解決方案1
1 2012-08-29 20:46:36
如果要在div中垂直對齊圖像，則應執行以下操作：
div {
position:relative;
height:500px;
width:500px;
}
div img {
position:absolute;
top:50%;
margin-top:-XXXpx; /* where XXX is half the height of the image */
}
解決方案2
0 2012-08-29 21:24:12
您可以將圖像設為背景圖像，然后將背景居中，如下所示：
<div style="height:500px; width 500px; line-height:500px; background: green url('/images/load.gif') left center no-repeat ; "></div>
如何將div中的文本水平居中，左邊的圖像與垂直對齊的中間
[英]How to center text in the div horizontally with an image at left with vertical align middle
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.