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

Question

如何让我的容器与我的图像大小相等。我有窗口的图像比例，我把它放在一个容器里，因为它是一个图像 slider 。

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. 我注意到您的 opacity 为 0，我删除了它以便您可以看到图像。