Question

即使图片尺寸小于表格单元格，如何使image占据整个table cell宽度和高度？我的图片位于div标记内。

Answer 1

尝试以下CSS - 此处的示例 - ＆gt; http://jsfiddle.net/Pq67x/1/

<style>
    div {
        width:50px;
        height:100px;
    }

    div img {
        height:100%;
        width: 100%;
        max-width:100%;
        max-height:100%;
    }
</style>
<div>
    <img src='path/to/img.gif' />
</div>

Answer 2

在这里：http://jsfiddle.net/chricholson/8Xer3/。它会扭曲图像：http://jsfiddle.net/chricholson/8Xer3/1/。默认情况下，您也不需要div，除非您正在使用它进行其他操作：http://jsfiddle.net/chricholson/8Xer3/2/。

HTML：

<table>
    <tr>
        <td>

            <img src="http://imgsrc.hubblesite.org/hu/db/images/hs-2001-24-a-web.jpg" />

        </td>
    </tr>
</table>

CSS：

td {
    width: 400px;
    height: 600px;
    background: yellow;
}

img {
    height: 100%;
    width: 100%;
}

图像占用CSS中的整个表格单元格宽度和高度

2 个答案: