CSS shorthand way of background

In CSS2.1, the shorthand background property includes five property values, CSS3 from the start, has added three new property value, add up to a total of eight.

CSS2.1

• background-color Use background color.
• background-image Background images used.
• background-repeat How to repeat a background image.
• background-attachment Or whether the background image is fixed with the rest of the page scroll.
• background-position The position of the background image.

CSS3

• background-size Size of the background image.
• background-origin Positioning area of ​​the background image.
• background-clip Drawing area background.

Shorthand

background: 

[background-color]

 [background-image] 

[background-repeat] 

[background-attachment] 

[background-position] /

[ background-size] 

[background-origin] 

[background-clip];

Note that the inside of / it and the font and border-radius shorthand used in / usage is similar. / In such an approach can support the browser background-position and then write back background-size .
In addition, you can also add two additional attribute values to describe it: background-origin and background-clip

Examples of methods:

.example {
  background: aquamarine 
              url(img.png) 
              no-repeat 
              scroll 
              center center / 50% 
              content-box content-box;
}