背景是什么：透明url（）;做？

我看到一个CSS代码，其中有人喜欢背景是什么：透明url（）;做？

body { background: transparent url ('background.jpg') repeat scroll;}

什么是透明的价值呢？我试着googleing这个，但没有帮助。不会background.jpg只是重写它？

谢谢。

来源

2012-04-26 Matt

transparent是颜色。元素可以同时具有背景图像和背景颜色。

以上是等效于：

body { 
    background-color: transparent; 
    background-image: url('background.jpg'); 
    background-repeat: repeat; 
    background-attachment: scroll; 
}

颜色是在一般重要的，如果例如背景图片加载失败，或者图片包含透明区域，或者图片不会重复填充整个区域（这在您的示例中肯定不是这种情况）。

但是，由于transparent是“初始值”，所以在使用background简写时绝对没有必要，因为速记自动将所有未指定的属性设置为初始值。

因此，唯一使用情况下transparent有意义作为背景颜色包括：

不使用速记，而是直接使用background-color属性;
使用它来覆盖另一个直接应用于该元素的选择器。

一个例子是

body.foo { background-color: blue; } 
body.foo.bar { background-color: transparent; }

来源

2012-04-26 06:22:16 Domenic

恐怕这是不正确的。显式设置该值完全没有区别（请参阅我的答案）。 – user123444555621 2012-04-26 06:39:10

好抓@Pumbaa80，我认为它是'inherit'。定影。 – Domenic 2012-04-26 06:42:34

@MrLister，我说“修复”，而不是“固定”。 *现在*它是固定的;）。 – Domenic 2012-04-26 06:47:07

其实，它不是必需的。

http://www.w3.org/TR/CSS21/colors.html#background
给出一个有效的声明中，“背景”属性首先将所有的个人背景属性为初始值，然后分配在声明中给出明确的数值。

由于background-color的初始值is transparent，它是隐含设置background:url(...);

时更精确地应用，你的风格规则相当于

background-color: transparent; 
background-image: url(...); 
background-repeat: repeat; 
background-attachment: scroll; 
background-position: 0% 0%;

在这两种情况下

。

然而，许多作者（包括我自己）更明确地设置值

的可读性
，以防止任何浏览器的bug，或者干脆
，因为他们不知道更好

来源

2012-04-26 06:31:01 user123444555621

背景是什么：透明url（）;做？

回答

相关问题