CSS 背景是什么：透明 url(); 做？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10328204/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
what does background: transparent url(); do?
提问by Matt
I saw a css code where it was like
我看到了一个 css 代码，它就像
body { background: transparent url ('background.jpg') repeat scroll;}
What does the transparent value do? I tried google'ing about this, but no help. Wouldn't background.jpg just override it?
透明值有什么作用？我试过谷歌搜索这个，但没有帮助。background.jpg 不会覆盖它吗？
Thank you.
谢谢你。
回答by Domenic
transparentis the color. An element can have both a background image and a background color.
transparent是颜色。一个元素可以同时具有背景图像和背景颜色。
The above is equivalent to:
以上相当于：
body {
background-color: transparent;
background-image: url('background.jpg');
background-repeat: repeat;
background-attachment: scroll;
}
The color is important in general if e.g. the background image fails to load, or the image contains transparent regions, or the image does not repeat to fill the entire area (which is admittedly not the case in your example).
如果例如背景图像无法加载，或者图像包含透明区域，或者图像没有重复填充整个区域（这在您的示例中肯定不是这种情况），颜色通常很重要。
However, since transparentis the "initial value", it is never necessary when using the backgroundshorthand, since the shorthand automatically sets all unspecified properties to their initial value.
但是，由于transparent是“初始值”，因此在使用background速记时永远不需要，因为速记会自动将所有未指定的属性设置为其初始值。
Thus, the only use case where transparentmakes sense as a background color involves:
因此，transparent作为背景颜色有意义的唯一用例包括：
- not using the shorthand, but instead directly using the
background-colorproperty; - using it to override another selector applying directly to that element.
- 不使用速记，而是直接使用
background-color属性； - 使用它来覆盖另一个直接应用于该元素的选择器。
An example would be
一个例子是
body.foo { background-color: blue; }
body.foo.bar { background-color: transparent; }
回答by user123444555621
Actually, it is not required.
实际上，这不是必需的。
http://www.w3.org/TR/CSS21/colors.html#background
Given a valid declaration, the 'background' property first sets all the individual background properties to their initial values, then assigns explicit values given in the declaration.
http://www.w3.org/TR/CSS21/colors.html#background
给定有效声明，“background”属性首先将所有单独的背景属性设置为其初始值，然后分配声明中给出的显式值。
Since background-color's initial value is transparent, it is applied implicitly when setting background:url(...);
由于background-color的初始值是transparent，它是隐式应用时设定background:url(...);
More precisely, your style rule is equivalent to
更准确地说，你的风格规则相当于
background-color: transparent;
background-image: url(...);
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
in both cases.
在这两种情况下。
However, many authors (including myself) prefer to explicitly set the value
但是，许多作者（包括我自己）更喜欢显式设置值
- for readability
- to prevent any browser bugs, or simply
- because they don't know better
- 为了可读性
- 以防止任何浏览器错误，或者只是
- 因为他们不知道更好
