CSS Background
CSS background properties are used to define the background effects of an element.
CSS properties used for background effects include:
background-colorbackground-imagebackground-repeatbackground-attachmentbackground-position
The
background-color property specifies the background color of an element.
The background color of a page is defined in the body selector, e.g.,
body { background-color:#b0c4de; }
The background color can be specified by:
- name—a color name, like
"red",
- RGB—an RGB value, like
"rgb(255,0,0)", and
- Hex—a hex value, like
"#ff0000".
For example, the
h1 and
div elements have different background colors:
h1 { background-color:#6495ed; }
div { background-color:#b0c4de; }
Background Image
The
background-image property specifies an image to use as the background of an element.
By default, the image is repeated so it covers the entire element.
The background image for a page can be set like this:
body { background-image:url('bg.png'); }
Demonstration
The following demonstration shows how the script of HTML and CSS is displayed on the Web:
