How to add background color | Html Colors





How to add background color



In this example we are going to show you an easy and simple way to add background color to an square box

      
//HTML

<!DOCTYPE html>
<html lang="ru">
    <head>
        <meta charset="utf-8">
        <title>background-color Tutorial</title>
    </head>
    <body>
        <div class="block block1"></div>
    </body>
</html>

//Style(CSS)

.block {
    display: inline-block;
    width: 192px;
    height: 192px;
    margin: 5px;
    border-radius: 5px;
    box-shadow: 1px 1px 3px #999999;
}

.block1 {
    background-color: #2ecc71;
}


//Javascript

No javascript needed.


    
        
        


Definition, Usage and Tips


If for any reason you need the entire page to be red, then you will need to add style="background-color:red" inside of <body> tag.


If for any reason you need to change your font color to red, then you will need to add style="color:red" inside of <p> tag.


You can use this property on CSS and Html


Tip:

You will always need the background-color property.


Login to save this tutorial to your saved tutorials.




SHARE THIS COLOR TUTORIAL WITH YOUR FRIENDS!








Join Htmlcolors now and start commenting whatever you want!


Log in Sign up