使用 css 更改 div 的背景大小答案

【问题标题】：Changing the size of a background for a div using css使用 css 更改 div 的背景大小
【发布时间】：2009-12-06 14:27:20
【问题描述】：

我有一个不完全适合的 div 的背景图像。有没有办法使用 css 来改变图像的大小（例如 background-size:10%）？

.header-tab { background: transparent url(/resources/images/light-green-gradient.png) repeat-x scroll 0 0; }

【问题讨论】：

标签： css

【解决方案1】：

background-size 是一个可以设置的css3值

见：http://www.w3.org/TR/css3-background/#the-background-size

或使用此方法 http://css-tricks.com/how-to-resizeable-background-image/

【讨论】：

【解决方案2】：

background-size 尚未在任何浏览器中实现，但有 -*-background-size 用于最新版本的 Mozilla、Webkit、Konqueror 和（有缺陷的）Opera：

background-size: 10%;
-moz-background-size: 10%;
-o-background-size: 10% auto; /* Opera needs x AND y values, or no background! */
-webkit-background-size: 10%;
-khtml-background-size: 10%;

不要在 Opera 中与 background-attachment:fixed 一起使用。

Mozilla Developer Center 有更多适用于 Firefox 3.5 的解决方法。

对于较旧的浏览器，您可以使用 Jimmy 的第二个链接中的 img 来模拟它，但是当然您必须弄清楚如何在新浏览器中隐藏该图像。

【讨论】：