How to change background color in HTML?

How to change background color in HTML: Adding a beautiful background color can bring a big variation on your web page. You need to choose a color wisely as the different webpage have different aspects. If you are not satisfied by the color you selected before and want to change it then you in a right place. This article will help you step by step how to change the background color in HTML.

How to change background colour in HTML?

Some important things that you should keep in mind before changing the color of the page:

  • You should always choose those color which is attractive and light so that the text is available and it’s readable.
  • When you don’t specifically choose a color on your webpage the browser will default to white.
  • Don’t use excessively bright color as background which can make reading difficult.

There are several methods in changing background color in HTML. Below are some of the methods:

Method 1: Preparing to edit HTML:

STEP 1: you have to determine the background color you want to select. HTMP colors are purely dedicated by codes as per shade basis. You can even use W3School HTML to choose the color code you want on your website.

  • You need to go to a website of ‘w3school’ through the internet.
  • Then you have to click a base color you would like to use on your web page.
  • Now you have to select the shade from the right side of the page.
  • Now you have to write doen the color code given on the right side of the shade.

STEP 2: now you have to open the HTML file with your txt editor. Background color along with all other style aspects of the page should be handles by using CSS.

Step 3: now you have to add the HTML header to your document. All the style and importent information of thr page should be coded between the <style></style> tags:

<!DOCTYPE html>

<html>

<head>

<style>

</style>

</head>

</html>

Step 4: now you have to creat a blank space between the “style” tags. You have to live one line where you can add information below the <style>tag and above the </style> tag.

Step 5: now you have to add the body element like you have to follow in between the <style></style>tags:

Method 2: setting a solid background color:

Step 1: you have to find out documents HTML header which should be near the top of the document.

Step 2: now you have to add the background color properties to the body element. Here you have to type the background color between the brackets. The spelling of “color” will work but not “colour”.

Like an example given below:

body {

    background-color:

}

Step 3: now you have to add the desired background color in the properties. You have to write the selected color numerical code which is followed by semicolon next to the”background color”.

to set the page background to blue you can follow the below example:

body {

    background-color: #4dabff;

}

Step 4: now you have to review the style information as your HTML documents header should resemble the following:

<!DOCTYPE html>

<html>

<head>

<style>

body {

background-color: #4dabff

}

</style>

</head>

</html>

Step 5: now you have to use background code to apply background color to other elements. You can use different color for different like for main header (<h1>) or a paragraph (<p>). Below you will see a given example:

<!DOCTYPE html>

<html>

<head>

<style>

body {

    background-color: #ffe14d;

}

h1 {

    background-color: #ff944d;

}

p {

    background-color: #ff4da8);

}

</style>

</head>

<body>

<h1>Header with Green Background</h1>

<p>Paragraph with white background</p>

</body>

</html>

METHOD 3: changing color in HTML

Step 1: you have to open HTML page in a basic text editor like a note pad.

Step 2: Now you have to locate the top “body” tag which can also appear as “<body>” or with other attributes. Example as  “<body text=”#000000″>.”

Step 3: Now you have to enter the following code into the “body” to tag: bgcolor=”COLOR” Replace “COLOR” with the actual color you want. You can use the 16 basic colors by name: yellow, black, red, gray, maroon, lime, olive, green, silver, blue, aqua, navy, fuchsia, white, teal and purple. You can also specify advanced colors in hex code, such as “#4d82ff” for dark blue or “#000102″ for black. For example, to change the background to bark blue, the entire body tag might look like: <body text=”#000102″ bgcolor=”dark blue”> or <body text=”#000102″ bgcolor=”#4d82ff”>

Step 4: how you can save the change and upload in an HTML page to the web service to make it active.

Benefits:

Best background color can attract the traffic to your webpage. Always remember that dont use too bright color which can lose the redablety. More of vesitors spends time on your website its good for your website. You just have to keep in mind that color can play a main role in sttracting traffic on your website always use a light smooth color which will not creat problem to the eyes and the infoemation images provided on the website is clear. You should always remember that color of the background can bring a lot of difference.

Conclusion:

Above methods are very useful if you want to change the color of your website and want to give some new look. Want to attract new visitors and want your page to be popular and in the search engine. You just have to follow the code and format them properly to achieve a hike in your page.

To get more details about How to change background color in HTML visit official website.

Leave a Comment

Your email address will not be published. Required fields are marked *