html - HTML 图像相对大小在 Chrome 中未按预期拉伸

Question

该图像没有将其高度拉伸为宽度的原因是什么？

仅在 Webkit 中！

http://jsfiddle.net/CgEhg/8/

编辑：很多人遇到麻烦，只需使用 Chrome

Answer 1

除非您有多个表格和多个图像用于不同数据的布局，否则您可以为tableor定义相同的样式，这应该td与and一起使用。 imgChromeIEFirefox

Fiddle 上的示例http://jsfiddle.net/2BdQT/

或者

CSS：

table, img
{
    height:40px;
    width:40px;
}

td,tr,tbody
{
    width:100%;
    height:100%;
}

​<strong>html:

<table  border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td><img src="http://www.google.com/logos/2012/stgeorge12-hp.png"></td>

    </tr>
</table>

​</p>

Answer 2

您需要样式td而table不是img标签

jsFiddle

Answer 3

这是你能做的最好的：http: //jsfiddle.net/CgEhg/41/

<table  border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td><img src="http://www.google.com/logos/2012/stgeorge12-hp.png" /></td>       
    </tr>
</table>

table{
    height:40px;
    width:40px;
}    
img{
    height:auto;
     width:100%;
}
td,tr,tbody{
    height:100%;
    height:100%;
}