How to Add Background Colors Using CSS

This technique allows you to set a background color to your website or an objects.

Steps to Adding Background Color Using CSS

Start by creating the object that will have the background colors added to it.

<div id="box">
This is the object will have a background color.
</div>

Now you must use CSS elements to add the background color.

#box {
  background:#0054B3;
}

Using both the HTML and CSS code above, I added the color #FF0000 (Red) to the background of the object named box.

Now to make the background color change you need:

1. Define which element you wish to change the background color on
2. Find the correct hexadecimal code for the color you have picked (search the web for hexadecimal codes)

Setting the Background Color of Your Entire Website

For the example we changed the background color to an object, but you can set the background of the website by doing the following.

body {
  background:#0054B3;
}

Result: Background Color Added to Object

By using the code, we were able to add a background color using CSS.

Browser Support

This method has been tested in Firefox, IE 6, 7,Safari and Opera.

Conclusion

The code used is the standard technique for adding background colors using CSS.