javascript - 在表格单元格中自动调整背景图像

Question

你好我现在正在制作一封新闻信，这封信现在的要求是将背景图片提供给某些 TD现在我需要调整图像大小，因为它们的父 TD 已调整大小，即如果表格宽度设置为 50% 或 500 或任何其他值，我需要调整背景图像大小以适应新宽度任何想法 :)谢谢

Answer 1

使用 CSS3，您可以使用 background-size 属性调整背景大小:

将此添加到您的 CSS 将在最新的浏览器中将背景拉伸(stretch)到 100% 宽度和 100% 高度。

td {background-size: 100% 100%;}

然而，这可能会使图像发生不希望的倾斜，因此您可能更愿意只使用 background-size: 100%;，它将宽度设置为 100%，将高度设置为自动。

要支持稍旧的浏览器，您需要使用 vendor 前缀，如下所示:

-moz-background-size: 100%; /* Gecko 1.9.2 (Firefox 3.6) */
-o-background-size: 100%; /* Opera 9.5 */
-webkit-background-size: 100%; /* Safari 3.0 */
-khtml-background-size: 100%; /* Konqueror 3.5.4 */
-moz-border-image: url(mtn.jpg) 0; /* Gecko 1.9.1 (Firefox 3.5) */

上面的例子is from this site ，完整的规范在这里 - http://www.w3.org/TR/css3-background/#the-background-size