为什么我的图像在我的桌子上扭曲？

以下是有问题页面的链接：http://sites.udel.edu/materials-characterization/。为什么我的图像在我的桌子上扭曲？

正如您所看到的，1行6列表格中的图像正在疯狂扭曲。编码表和他们的CSS，我很糟糕，似乎无法工作，因此图像将显示为120px乘120px。我相信这是简单而明显的事情，但我一直无法做到。我试着在我的CSS中设置这些设置：

td { 
    padding:0px; 
    width:16.6%; 
    margin:0px;}

无济于事。

这是表的HTML：

<table> 
    <tr> 
    <td><img style="height: 120px;" src="http://imageshack.com/a/img661/7633/1iiqa5.png" alt="" /></td> 
    <td><img style="height: 120px;" src="http://imageshack.com/a/img905/7443/rsWUcI.png" alt="" /></td> 
    <td><img style="height: 120px;" src="http://imageshack.com/a/img537/6786/ISbtBn.png" alt="" /></td> 
    <td><img style="height: 120px;" src="http://imageshack.com/a/img912/2283/wjNYwR.png" alt="" /></td> 
    <td><img style="height: 120px;" src="http://imageshack.com/a/img673/7112/0wOLLR.png" alt="" /></td> 
    <td><img style="height: 120px;width:120px;" src="http://imageshack.com/a/img661/8118/qKGYlR.png" alt="" /></td> 
    </tr> 
</table>

预先感谢您的任何建议你可以给我！

来源

2015-05-07 BEE bee

您给出了td的宽度为16.6％，这就是为什么。 http://i.imgur.com/HfzjqYw.png – Morb

谢谢大家的快速和有益的回应！现在填充/边距太宽，但我想我可以从这里拿走它！ –

删除#content img{max-width:100%}。您正在为影响图像比例的所有图像指定高度。

来源

2015-05-07 06:22:25 xengravity

是的，你将不得不选择，如果你使用“宽度”或“高度”。如果您想保持图像比例，则不能同时进行。 – Bram

我会切换到响应方式。在你的标签取下风格属性，将其添加到CSS：

td img { 
    max-width: 100%; 
    height: auto; 
    }

这样，图像可能会缩小，但不得变形。

来源

2015-05-07 06:24:10 NiloVelez

您在style.css中的第743行上设置了padding: 6px 24px;，它覆盖问题中声明的padding: 0;。

来源

2015-05-07 06:25:32 panther

为什么我的图像在我的桌子上扭曲？

回答

相关问题