xFactorSchool.com(Beta)
How to Do Examples
Python Examples
HTML Examples
Code Examples
C Code Examples
C++ Code Examples
C# Code Examples
Java Code Examples
Python Code Examples
HTML Code Examples
CSS Code Examples
JavaScript Code Examples
Online Editor
C Code Editor
C++ Code Editor
C# Code Editor
Java Code Editor
Python Code Editor
HTML Code Editor
CSS Code Editor
JavaScript Code Editor
Practice how to set background color to a div element using CSS
CSS Online Editor
Run Code
More CSS Sample Codes
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Set background color to div Element using CSS</title> <!--Internal CSS added--> <style> /* CSS id name used to apply css style to the divs*/ #div-1 { background-color: lightpink; /*background color of the div*/ min-height: 40px; /* minimum height of the div*/ } #div-2 { background-color: lightblue; /*background color of the div*/ min-height: 40px; /* minimum height of the div*/ margin-top: 10px; /* margin at the top of div*/ } #div-3 { background-color: lightgreen; /*background color of the div*/ min-height: 40px; /* minimum height of the div*/ margin-top: 10px; /* margin at the top of div*/ } </style> </head> <body> <h1>How to set background color to div element using CSS?</h1> <div id="div-1">First Div</div> <div id="div-2">Second Div</div> <div id="div-3">Third Div</div> <p> CSS property <code style="color:blueviolet">'background-color: lightpink;', background-color: lightblue; and background-color: lightgreen; </code> are applied respectively to the <div> elements to set different background color. </p> </body> </html>