CSS Backgrounds

👉 CSS Backgrounds

The background-color property specifies the background color of an element.

The background-image property specifies an image to use as the background of an element.

By default, the background-image property repeats an image both horizontally and vertically.

Showing the background image only once is also specified by the background-repeat property:

👉 CSS background-repeat Property

The background-attachment property specifies whether the background image should scroll or be fixed (will not scroll with the rest of the page):

CSS background-attachment Property👇

Example of fixed 👇

Example of scroll 👇

👉 The background-position property sets the starting position of a background image.

Note:-

By default, a background-image is placed at the top-left corner of an element and repeated both vertically and horizontally.

Property Values of background-position👇

Example of position center👇

Example based on horizontal and vertical position👇

Example of right center👇

The background-size property specifies the size of the background images.

Example of length property👇

We can also use two images in background.

Example👇

> Download our HTML & CSS Visual Treat! ebook Here: Click here