html - 如何将图像包裹在div中，然后将div居中

Question

我有这个 CSS:

   <style type="text/css">

    #heading{
        margin:auto; 
        background-color: brown;

    }
</style>

和这个 html:

<div id="heading">
        <image src="image_files/header-background.jpg" alt="speakom"   />
    </div>

我不知道图像的确切大小..但我希望 div 以准确的宽度包裹图像，然后我想使该 div 居中..我该如何实现？

Answer 1

使用 inline-block 将使 div 成为其内容的宽度，并允许您使用自动边距将其居中:

#heading {
    margin: 0px auto;
    display: inline-block;
}​