Cover Image for How to Change Background Color in Html
73 views

How to Change Background Color in Html

To change the background color in HTML, you can use the CSS (Cascading Style Sheets) background-color property. Here’s an example of how to change the background color:

HTML<span role="button" tabindex="0" data-code="<body style="background-color: lightblue;"> <h1>This is a heading</h1> <p>This is a paragraph with a colored background.</p>
<body style="background-color: lightblue;">
  <h1>This is a heading</h1>
  <p>This is a paragraph with a colored background.</p>
</body>

In the example above, the background-color property is applied to the <body> element using the style attribute. The value is set to lightblue to specify the desired background color.

You can specify the background color using various methods, such as color names, hexadecimal color codes, RGB values, or HSL values. Here are a few examples:

Using color names:

HTML<span role="button" tabindex="0" data-code="
<body style="background-color: yellow;">

Using hexadecimal color codes:

HTML<span role="button" tabindex="0" data-code="
<body style="background-color: #FF00FF;">

Using RGB values:

HTML<span role="button" tabindex="0" data-code="
<body style="background-color: rgb(255, 0, 255);">

Using HSL values:

HTML<span role="button" tabindex="0" data-code="
<body style="background-color: hsl(300, 100%, 50%);">

It’s important to note that the background-color property can be applied to various HTML elements, not just the <body> element. You can apply it to specific elements such as <div>, <section>, or <p> to change the background color of those elements.

You can also define the background color using external CSS stylesheets or within a <style> block in the HTML document.

Remember to choose background colors that provide sufficient contrast with the text color for readability purposes.

YOU MAY ALSO LIKE...

The Tech Thunder

The Tech Thunder

The Tech Thunder


COMMENTS