Want to know What is the correct HTML for adding a background color? Today I will show you How to add background color in HTML.
There are many ways to add background color in HTML. I will tell you all the ways to add background color in HTML so read till end.
What is the correct HTML for adding a background color?
Contents
HTML is just a skeleton of a website it does not have design it is like a structure so to add design or skin to this skeleton we use CSS which is a styling language for adding color, backgrounds, fonts and more to a website.
So we can use CSS to add background color in HTML elements. There are mainly 3 ways to add CSS to HTML which are:
- Inline CSS
- Internal CSS
- External CSS
I will show you all the ways to add background to HTML elements. So let’s see how to add background color to HTML.
1. Inline CSS
First method is inline css which is adding css inside html elements so to add background to a HTML element we will use the following code.
This code will make the div background red you can add this code to any HTML element with whatever background color you want just add the syntax correctly.
2. Internal CSS
Internal CSS is adding css code within the html page inside the <head> tag you need to create a <style> tag and inside that write your css code like this
This will make all the divs background color red you can be more specific by giving it a class or a id. This is a little more organised way of writing CSS.
3. External CSS
External CSS is writing code in a seperate .css file you need to create a file with extension .css and You need to put the below css code in your css file
Now you need to link this file in your HTML page to apply the CSS code to the HTML elements see the below code.
This will also make the background color of the HTML element red. This is the most suitable and recommended way of adding css to your HTML page.
I have told you all the ways of adding background color to HTML elements. I hope you found what you were looking for and if you want more guides like this do Join our Telegram Channel for future updates you can join here – Join Coderzway Telegram channel.
Here are some more guides you can read:
- Alphanumeric validation in javascript.
- Mobile number validation in javascript.
- How to print hello world in javascript.
Thank you for reading, Have a nice day 🙂