如何用CSS拉伸表格单元格的背景图像？

Question

如何用CSS拉伸表格单元格的背景图像？我用谷歌搜索没有结果.

当您设置单元格的背景图像并且背景大小小于单元格时,将重复该单元格.

如何强制此背景来拉伸整个表格单元呢？

Answer 1

可以使用background-sizeCSS属性拉伸背景图像.

例子:

body { background-size: 100% auto } /* Stretches image to full horiz. width */
body { background-size: 50% 50% } /* Stretches image to half of available
width and height - WARNING: aspect ratio not maintained */

body { background-size: cover } /* Ensures that image covers full area */
body { background-size: contain } /* Ensures that image is completely visible */

目前所有主流浏览器都支持该功能:

• IE自9.0以来
• Chrome自3.0起
• Firefox自4.0起
• Opera自10.0以来
• 自4.1以来的Safari

Answer 2

您无法拉伸背景图像。

如果要拉伸图像，则必须将其放入标签中img。您可以使用绝对定位将内容放在图像之上。