0

私の意味を理解するには、次のスニペットを参照してください。

<table style="width: 100%">
    <tbody><tr><td>
        <div style="width: 100%">
            <img src="myimage.png" />
        </div>
    </td></tr></tbody>
</table>

myimage.pngがブラウザウィンドウよりも小さい場合はdiv、ウィンドウサイズに合わせてレンダリングされます。ここまでは順調ですね。ただし、imgが大きい場合は、すべてが表示可能領域を超えます。

img幅を「画像の100％、ただし表示可能領域の100％以下」のように設定する方法はありますか？

更新： max-width: 100%画像はテーブル内で機能しないようです：http：
//jsfiddle.net/h58Ra/

4

1 に答える 1

3

max-widthまさにあなたが使うべきものです：http：//jsfiddle.net/h58Ra/（上img）。のdiv有無にかかわらず、サイズを超えてはなりませんwidth: 100%。

フィドルでを削除すると、それでも大きくならないことにmax-width: 100%気付くでしょう。divimg

どうやら、それは何らかの理由でそれを失敗させたdiv内部にありました。table私たちは一緒に解決策に到達しました:(コメントから）「style = "table-layout：fixed;を設定した場合。幅：100％「テーブルの場合、すべてが正常に機能します」。

于 2012-04-04T08:19:21.193 に答える