CSS background Property

CSS Background properties like background-color, background-image, background-position, background-repeat, background-attachment properties and many more.The background CSS property is a shorthand property for setting the individual background properties i.e. background-image, background-position, background-size, background-repeat, background-attachment, background-origin, background-clip and background-color in a single declaration.


The syntax of the property is given with:

background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;

Note: If one of the properties in the shorthand declaration is the bg-size property, you must use a / (slash) to separate it from the bg-position property, e.g. background:url(smiley.gif) 10px 20px/50px 50px; will result in a background image, positioned 10 pixels from the left, 20 pixels from the top, and the size of the image will be 50 pixels wide and 50 pixels high.

Example -