css - 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;
}