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-blockdisplay:inline<li>

Answer 4

または試す

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