What's the difference between specifying a background color using background
and background-color
?
Snippet #1
body { background-color: blue; }
Snippet #2
body { background: blue; }
Premising that those are two distinct properties, in your specific example there's no difference in the result, since background
actually is a shorthand for
background-color background-image background-position background-repeat background-attachment background-clip background-origin background-size
Thus, besides the background-color
, using the background
shorthand you could also add one or more values without repeating any other background-*
property more than once.
Which one to choose is essentially up to you, but it could also depend on specific conditions of your style declarations (e.g if you need to override just the background-color
when inheriting other related background-*
properties from a parent element, or if you need to remove all the values except the background-color
).