背景：VS背景颜色。有啥不同？ [复制]

Posted 2023-02-21

【中文标题】背景：VS背景颜色。有啥不同？ [复制]

【英文标题】：Background: VS background-color. What's the difference? [duplicate]背景：VS背景颜色。有什么不同？ [复制]

【发布时间】：2020-03-15 00:06:57

【问题描述】：

Background-color:rgb 按我的预期工作，但 background:rgb 填满了整个 div。我看过的每个教程都告诉我，这两个基本上是一样的，只是速记可以有更多的属性。

观看此视频以供参考。 https://www.youtube.com/watch?v=10Q5D8kUMQo

【问题讨论】：

没错。当您放置一种颜色时，您只需指定背景颜色，其他颜色将设置为初始颜色。 Check here了解更多信息

已经在这里回答了：***.com/questions/10205464/…background 是超集包含background-colorbackground-imagebackground-imagebackground-repeatbackground-attachmentbackground-clip@9876543@31 /跨度>

Background-color:rgb 按我的意图工作，但 background:rgb 填满了整个 div --> 你的意图是什么？向我们展示行为

【参考方案1】：

background 是以下属性的简写：

 - background-color
 - background-image
 - background-repeat
 - background-attachment
 - background-position

您可以详细了解每个属性here

属性顺序

在大多数浏览器实现中（我认为可能较旧的浏览器可能会出现问题），属性的顺序并不重要，除了：

background-origin 和background-clip：当这两个属性都存在时，第一个引用-origin，第二个引用-clip。

例子：

background: content-box green padding-box;

相当于：

background-origin: content-box;
background-color: green;
background-clip: padding-box;

background-size 必须始终跟在background-position 之后，并且属性必须用/ 分隔

如果background-position由两个数字组成，第一个是水平值，第二个是垂直值。

【讨论】：

感谢您提供此信息。在阅读您发布的链接时，我在底部看到属性必须与您列出的顺序相同。但是我以不同的顺序写了一个背景速记，它的工作原理完全一样吗？这是为什么？让我知道我是否应该就这个问题发表一篇新文章，或者是否有某种解释。

@Lazaro 我编辑回答你的第二点