HTML - 按高度将图像调整到表格单元格


HTML - fitting an image to a table cell by height

好的伙计们,我需要一些帮助...

我有一个表格单元格,我需要用我从 url 获得的图像填充它。图像宽/高比与表格单元格的宽度/高度比不同 - 图像比单元格长。我需要以 100% 的高度适合它,并修剪左右两端,使其适合宽度。

我是该网站的新手,所以我不能发布示例图片,但我希望我清楚地表明问题是什么......

任何帮助将不胜感激...

最简单的解决方案是将其设置为表格单元格的背景图像,它将自动在视觉上被裁剪。

如果要调整该背景图像的大小,使其完全覆盖表格单元格,同时保持其宽高比,则可以使用 css3 属性(有限的浏览器支持,IE...):

background-size: cover;

完整代码:

background: url(/url/to/image) no-repeat center center;
background-size: cover;     // just for modern browsers