使用css将div设为img,不使用js获取图像大小并设置div

时间:2011-10-20 18:40:02

标签: html css

是否可以使容器适合与包含图像相同的尺寸,而无需将图像的宽度和高度明确设置为容器?

<div id="imageContainer" style="background-color:black">
<img id="image" src="11.jpg"/>
</div>

2 个答案:

答案 0 :(得分:4)

<style>
#imageContainer{ display:inline-block; }
#image{ display:block; }
</style>

http://jsfiddle.net/dBLsP/1/

要使它在旧版浏览器中运行,您也可以使用它:

<style>
#imageContainer{
    display: -moz-inline-stack;
    display: inline-block;
    zoom: 1;
    *display: inline;
}
</style>

reference

答案 1 :(得分:1)

您可以使用

<style>
   .imageContainer{
      float:left;
    }
</style>

<style>
   .imageContainer{
       position: absolute
    }
</style>

或使用内联的其他元素,如<span>