如何在中間放置一個較小的div的圖像？

可能重複：
Aligning image to center inside a smaller div 如何在中間放置一個較小的div的圖像？

我有一個指向CSS 3的一個問題，請參閱我的HTML代碼的一部分：

<div id="main" style="width: 320px; height: 400px;"> 
    <img src="test.jpg" height="400" /> 
</div>

我不知道test.jpg文件的實際大小（寬度可以不同 - 文件是動態的）。我想要在中間的圖像=「主」（我不在乎，左圖&圖像的右側部分將超出範圍 - 它甚至更好）。我怎樣才能做到這一點？

2011-12-26 Jakub

你只需要水平或垂直也居中？ – 2011-12-26 20:59:15

只有水平的 – Jakub 2011-12-26 21:02:18

我沒有在這裏看到任何CSS3，除非你說你的圖像和div參與了這個問題出現的一些變換或動畫。你能詳細說明一下嗎？ – BoltClock 2011-12-26 21:03:06

只要您指定任何width，您可以通過添加margin:auto;來居中。這不是CSS3。

<img src="test.jpg" style="margin:auto; width:200px;display:block" />

2011-12-26 20:59:52 DOK

我不想調整圖像大小（寬度200），只需對齊中心 – Jakub 2011-12-26 21:07:02

所以，不要調整大小。 – 2011-12-26 21:09:00

但我不知道真正的大小，所以我不能設置寬度，即200px – Jakub 2011-12-26 21:11:44

這將做的工作

<div id="main" style="width: 320px; height: 400px;background-position:center;background-repeat:no-repeat;background-image:url('test.jpg')"> 

</div>

2011-12-26 21:12:31

您是否嘗試過使用此方法？ – 2011-12-27 07:11:35

是的，但我更願意使用。我已經解決了使用jQuery的問題。 – Jakub 2011-12-28 08:18:16

你能和我們分享嗎？ – 2011-12-28 08:19:33

回答