使用background和background-color指定背景色之间的区别是什么?
片段# 1
body { background-color: blue; }
段# 2
body { background: blue; }
使用background和background-color指定背景色之间的区别是什么?
片段# 1
body { background-color: blue; }
段# 2
body { background: blue; }
当前回答
这是最好的答案。速记(背景)是为了重置和干燥(与手写结合)。
其他回答
我注意到,当为Outlook生成电子邮件时……
/*works*/
background: gray;
/*does not work*/
background-color: gray;
关于CSS性能:
背景vs Background -color:
比较18个色块在一个页面上渲染100次的小 矩形,一次带有背景,一次带有background-color。
While these numbers are from a single page reload, with subsequent refreshes the render times changed, but the percent difference was basically the same every time. That's a savings of almost 42.6ms, almost twice as fast, when using background instead of background-color in Safari 7.0.1. Chrome 33 appears to be about the same. This honestly blew me away because for the longest time for two reasons: I usually always argue for explicitness in CSS properties, especially with backgrounds because it can adversely affect specificity down the road. I thought that when a browser sees background: #000;, they really see background: #000 none no-repeat top center;. I don't have a link to a resource here, but I recall reading this somewhere.
参考:https://github.com/mdo/css-perf#background-vs-background-color
我注意到在文档中没有看到的一件事是使用 背景:url(“image.png”)
像上面这样的简写,如果图像没有找到,它会发送一个302代码,而不是像你使用的那样被忽略
background-image: url("image.png")
有一个关于背景和背景颜色的错误
这个的区别, 当使用后台时,有时当你创建网页时 在CSS中 background: #fff //可以覆盖蒙版图像块(“顶部项目,文本或图像”)) 所以最好总是使用背景色 为了安全起见,在你的设计中,如果它是单独的
不同之处在于背景速记属性设置了几个与背景相关的属性。它会设置所有属性,即使你只指定了一个颜色值,因为其他属性被设置为它们的初始值,例如background-image为none。
这并不意味着它总是会覆盖这些属性的任何其他设置。这取决于通常被误解的规则下的级联。
在实践中,速记往往更安全一些。这是一种预防措施(不完全,但很有用),可以防止意外地从另一个样式表获得一些意外的背景属性,例如背景图像。此外,它更短。但是你需要记住它的意思是“设置所有的背景属性”。