使用background和background-color指定背景色之间的区别是什么?

片段# 1

body { background-color: blue; }

段# 2

body { background: blue; }

当前回答

没有区别。两者将以同样的方式工作。

CSS背景属性用于定义背景效果 一个元素。 用于背景效果的CSS属性: 背景颜色 背景图像 平铺方式 background-attachment 背景位置

Background属性包括所有这些属性,您可以将它们写在一行中。

其他回答

我发现你不能用background-color设置渐变。

如此:

background:linear-gradient(to right, rgba(255,0,0,0), rgba(255,255,255,1));

这不是:

background-color:linear-gradient(to right, rgba(255,0,0,0), rgba(255,255,255,1));

这是最好的答案。速记(背景)是为了重置和干燥(与手写结合)。

不同之处在于背景速记属性设置了几个与背景相关的属性。它会设置所有属性,即使你只指定了一个颜色值,因为其他属性被设置为它们的初始值,例如background-image为none。

这并不意味着它总是会覆盖这些属性的任何其他设置。这取决于通常被误解的规则下的级联。

在实践中,速记往往更安全一些。这是一种预防措施(不完全,但很有用),可以防止意外地从另一个样式表获得一些意外的背景属性,例如背景图像。此外,它更短。但是你需要记住它的意思是“设置所有的背景属性”。

其中一个区别是:

如果你以这种方式使用图像作为背景:

background: url('Image Path') no-repeat;

然后你不能用"background-color"属性覆盖它。

但是如果你使用背景来应用颜色,它和background-color是一样的,并且可以被覆盖。

例如:http://jsfiddle.net/Z57Za/11/和http://jsfiddle.net/Z57Za/12/

我注意到在文档中没有看到的一件事是使用 背景:url(“image.png”)

像上面这样的简写,如果图像没有找到,它会发送一个302代码,而不是像你使用的那样被忽略

background-image: url("image.png")