You can change the color of the background using CSS, or use a background image. Background colors and background images can be applied to the entire page or to individual elements. Changing background colors on individual elements helps to add highlight and color to certain areas of the page.

Changing background color

The background color of an HTML element is changed with the background-color CSS property. The background color uses the same syntax (hex code) as font colors. For example,

body {
background-color: #FFFF00;

With this CSS, the background color of the page would be yellow.

Adding a background image

Background images are a good way to create a nice looking HTML page. Using a background image, you can create a gradient effect, where one part of the page is a solid color and the color fades out or gets lighter as it stretches to the other side.

Background images appear behind other elements. This means that you can overlay all your HTML, including other images, on top of a background image.

Background images are added with the background-image CSS property. For example,

background-image: url("/image.jpg");

One of the features of background images is that you can tile or repeat them within a page. This means that no matter how large the visitor’s screen, the background image will always appear. Conversely, you can also choose to not repeat the background image.