A background color is the color rendered behind an element’s content. In CSS, use background-color, sometimes shortened to background, and choose a color keyword such as lavender or darkblue. section 3.2.6
color: darkblue; background-color: lavender;
Use color for text and background-color for the element behind it. section 3.2.6
Customize the background by changing the color keyword on the element you want to affect:
- Set body’s background-color to change the page background. section 10.8
- Set header or footer background-color to give those regions their own color. section 10.8
- Change the final rgba() value on an overlay background-color to control transparency from opaque to transparent. section 10.8
- Check contrast: dark text on a light background or light text on a dark background remains easier to read. section 3.2.6
A simple page background
body { color: darkblue; background-color: lavender; } This makes the page background lavender and the text dark blue. Replace lavender with another CSS color keyword to try a different look. section 3.2.6
