CSS：宽度问题

Question

我有一个里面有图像的列表项，例如：

<ul>
    <li>
        <img></img>
    </li>
</ul>

图像不占据li的整个宽度。

如何让li宽度缩小到包含图像的大小？

Answer 1

做图像的高度

   <ul>
        <li>
            <img src="" width="xxx" height="xxx"></img>
        </li>
    </ul>

现场演示http://jsfiddle.net/CZqEc/

更新了现场演示http://jsfiddle.net/CZqEc/1/

Answer 2

如果将li设置为display: inline，因为默认情况下li是块，所以宽度将匹配最大/最宽元素。

Answer 3

如果<li>为display:block或类似（list-item也是）

使用li img{max-width:100%}

---

如果<li>是display:inline-block或display:inline 您还需要设置<li>宽度

Answer 4

或尝试

li
{
background:url('');
display:   ;
background-size:xx xx;
}