Background colors in css

In this aticle we are going to learn about background colors in css, how to give our text specific background color look.

We learnt about css in general learning what css can do in web pages and colors in css so, now we are going to go through some background colors to give our text a nice look.

Background colors

Background Colors are used in Cascading Style Sheets to give html elements look the way the developer likes. A developer can give the text a red background color or yellow background color for some reasons so, we can do that with the help of css.

Let us see how we can give our text specific background color on our web page. So, we are going to give a text red color, copy and paste below code.

<div style="background-color: red;">This is red background text.</div>

So, we should have the following results.

This is red background text.

We have created a text that have red background color and this is because of the style attribute in div tag.

Let us create a text with green background color, copy and paste below code.

<div style="background: green;">This is green background text.</div>

So, we should have the following results.

This is green background text.

We have created a text that have green background color and this is because of the style attribute in div tag.

Let us create a text with purple background color, copy and paste below code.

<div style="background: purple;">This is purple background text.</div>

So, we should have the following results.

This is purple background text.

We have created a text that have purple background color and this is because of the style attribute in div tag.

Let us create a text with yellow background color, copy and paste below code.

<div style="background: yellow;">This is yellow background text.</div>

So, we should have the following results.

This is yellow background text.

We have created a text that have yellow background color and this is because of the style attribute in div tag.

Let us create a text with blue background color, copy and paste below code.

<div style="background: blue;">This is blue background text.</div>

So, we should have the following results.

This is blue background text.

We have created a text that have blue background color and this is because of the style attribute in div tag.

Let us create a text with orange background color, copy and paste below code.

<div style="background: orange;">This is orange background text.</div>

So, we should have the following results.

This is orange background text.

We have created a text that have orange background color and this is because of the style attribute in div tag.

Let us create a text with black background color, copy and paste below code.

<div style="background: black;">This is black background text.</div>

So, we should have the following results.

This is black background text.

We have created a text that have black background color and this is because of the style attribute in div tag.

Let us create a text with grey background color, copy and paste below code.

<div style="background: grey;">This is grey background text.</div>

So, we should have the following results.

This is grey background text.

Conclusion

In this article we learnt about background colors in css and how we can give text different background colors that we like. This can be done with all background colors you know and can be applied to all text in html.