Html 使图像的高度和表行的其余部分相同

我有一个表，其中包含几列文本，还有一列带有图像（图标）

我希望图标能够根据行的高度进行缩放，即使调整表的大小也是如此

看起来这会有帮助，但没有

当然，我正在寻找一个跨浏览器的解决方案，但我愿意将其限制在“现代”浏览器上

<table>
  <tbody>
    <tr>
      <td>One</td>
      <td>Two</td>
      <td><img src="http://localhost/images/small_gold_star.png"></td>
    </tr>
  </tbody>
</table>

一个
两个

一个选项是将图像设置为td的背景。然后将该图像的

background size

属性设置为

cover

或

contain

。

cover

值将：

缩放背景图像，使其尽可能大，以便 背景区域被背景图像完全覆盖。一些 部分背景图像可能在背景中看不到 定位区

包含的值将：

将图像缩放到最大大小，以使其宽度和宽度
高度可以放在内容区域内

大概是这样的：

<table>
  <tbody>
    <tr>
      <td>Some text here</td>
      <td>Some more text here</td>
      <td>More and more and more and more and more text here</td>
      <td class="icon"></td>
    </tr>
  </tbody>
</table>

<style>
  td.icon {
    background: url(my-icon.png);
    background-size: cover; /*MAYBE "contain"?*/
    background-repeat: no-repeat;
  }
</style>


这里有一些文字
这里有更多的文字
这里有越来越多的文字
td.icon{
背景：url（my icon.png）；
背景尺寸：封面；/*可能是“包含”*/
背景重复：无重复；
}
您能提供一些代码吗？您能显示您当前的代码吗？绝对定位可能会有帮助，但表格也可能溢出，因为最后一列并没有宽度：（我不明白为什么它在Chrome中对我不起作用