CSS Backgrounds

CSS backgrounds property is used to control the background effect of the HTML element. These background effects will be:

Background clipping
Multiple backgrounds of the element
Controlling background size around the HTML element.

CSS3 Background Properties

Followings are the properties of CSS3 backgrounds:

Background Property	Value
`background-color:`	It is used to provide background color.
`background-image:`	It is used to provide a background image or gradient around the HTML element.
`background-repeat:`	It has the followings values repeat (default), no-repeat, repeat-x, repeat.
`background-position:`	It is used to set the background-position of the image.
`background-attachment:`	It has followings values: scroll(default), fixed
`background-size:`	It has followings values: auto( default), cover, contains.
`background-origin:`	It has followings predefined values: padding-box(default), content-box and border-box.

CSS Background Color

CSS background-color property is used to set the background color of the HTML element. Color can be represented by hexadecimal code, RGBA values, HSL values, and actual color names.

General Syntax

      background-color:color;

Try it now

Source Code

          body {
  background-color: slateblue;
}

h2 {
  color: white;
  font-size: 2em;
}

Try it now

CSS Background Image

The CSS background-image property is used to set the background image at the background of the HTML element.

General Syntax

      background-image:url(path);

Try it now

Source Code

          body{
 background-image:  url('../sliderimages/1.jpg');
}

Try it now

Web Tutorials

Html Tutorial HTML

Javascript Tutorial JAVASCRIPT

Css Tutorial CSS

Bootstrap 5 Tutorial BOOTSTRAP 5

Bootstrap 4 Tutorial BOOTSTRAP 4