background:transparent url(); 做?

Mat*_*att 5 css background

我看到了一个css代码

   body { background: transparent url ('background.jpg') repeat scroll;} 
Run Code Online (Sandbox Code Playgroud)

透明值有什么作用?我试着谷歌这个,但没有帮助.background.jpg不会覆盖它吗?

谢谢.

Dom*_*nic 6

transparent是颜色.元素可以具有背景图像和背景颜色.

以上相当于:

body {
    background-color: transparent;
    background-image: url('background.jpg');
    background-repeat: repeat;
    background-attachment: scroll;
}
Run Code Online (Sandbox Code Playgroud)

一般情况下,如果背景图像无法加载,或者图像包含透明区域,或图像不重复以填充整个区域(在您的示例中,情况并非如此),颜色通常很重要.

但是,由于transparent是"初始值",因此在使用background速记时永远不需要,因为速记会自动将所有未指定的属性设置为其初始值.

因此,transparent作为背景颜色有意义的唯一用例涉及:

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

一个例子是

body.foo { background-color: blue; }
body.foo.bar { background-color: transparent; }
Run Code Online (Sandbox Code Playgroud)