如何在HTML表格的TD中调整图像大小

Question

我正在使用以下代码在TD中显示图片：

但是，图片似乎比为TD定义的宽度更宽。

请给我提供一些解决方案。

- user1940318

---

发布你的HTML/CSS，这样我们就可以看到你尝试了什么。创建一个jsfiddle。 - Marc Audet

Answer 1

CSS解决方案

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

- aCodeSmith

---

请记住，这将适用于表格 td 内的 所有 图像。如果您只想要特定的 img，则选择器需要比此更具体。@aCodeSmith 的 CSS 解决方案不错。 - blurfus

Answer 2

你可以尝试这个：

如果你想让所有的 <td> 都有图片：

HTML:

<table class="imagetable">

<tr>

<td>Hey wat up</td>

</tr>

</table>

CSS：

.tableimage td {
background-image:url('http://example.com/image.jpg');
background-size: 100% 100%;
}

如果您只想让一个有一张图片

HTML:

<td class="image">Hey wat up</td>

CSS：

.image {
background-image:url('http://example.com/image.jpg');
background-size: 100% 100%;
}

希望这有所帮助 :)

- electrikmilk

---

此解决方案仅在<td>标签内有内容时有效，否则将不会显示该<td>标签。 - Raptor

@Raptor 是的，所以我想你可以为 <td> 添加一些填充或固定宽度。 - electrikmilk