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

是什么原因使这张图片的高度没有像宽度一样伸展

仅适用于Webkit

---

编辑：很多人都有问题，只需使用Chrome，你需要设置

td

的

table

的样式，而不是

img

标签

---

除非您有多个表格和多个图像用于不同的数据布局，否则您可以使用

img

为

表格

或

td

定义相同的样式，这应该适用于

Chrome

以及

IE

和

Firefox

提琴样品

或

css：

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

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

​html：

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

    </tr>
</table>

---

​

这是你能做的最好的事情：

---

很抱歉，这不是我想要的。你不明白，我想要图像自动拉伸到40px作为表格大小。然后另一种方法是在photoshop中将图像压缩到40px。否则，使用css维度看起来总是很糟糕。这可不是什么好事，我已经知道我可以将IMG设置为40px。这不是我需要的。我希望示例保持原样，因为它是专门为说明问题而创建的。请仅尝试定义img样式。不需要定义其他ITEN。好的，情况不太好。但要揭露这一点。HTML中的元素对位置和行为的作用不同。

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