css - 容器大小等于图像大小

Question

我怎样才能让我的容器等于我的图像的大小。我有窗口的图像比例，我把它放在一个容器内，因为它是一个图像滑块。

CSS

#full_image { 
 overflow:hidden;
 position:absolute;
 display: inline-block;
 margin: 5% 5% 5% 5%;
 opacity: 0;
}

#full_image  ul {
 display: -moz-inline-stack;
}

#full_image ul li img{
 width:100%;
 max-width:100%;  
 overflow: hidden;    
 display: inline-block;  
 }

HTML

<div id="full_image"> 
    <ul>
       <li>
           <img src="'+img+'"/>
       </li>
    </ul> 
</div>

Answer 1

这是一个工作jsfiddle。我添加了一些额外的 CSS 来显示边框。

1. 您注意到您可以更改图像的宽度#full_image和图像比例（例如，不需要为它指定宽度以填充它所在的空间）。
2. 您只需要 max-width 即可使其缩放。
3. 我注意到你有opacity0，我删除了它，所以你可以看到图像。