HTML Styles 📌


The HTML style attribute is used to add styles to an element, such as color, font, size, and more.


Let's talk about HTML style.

When it's come to an excellent looking website, we need to use some styles. We have more than 2 ways to use styles. See below for more info.

  1. Inline Style | We need to use style="property:value;"
  2. Internal Style | We need to use style tag on head, We will talk about later
  3. External Style | We must create a external css file style.css & then we need to use link to add this style file.

Now it's time practically apply time

Let me right down a simple example.

                        
<p style="color:red;">I am red text</p>
<p style="color:green;">I am green text</p>
<p style="color:yellow;">I am yellow text</p>
                        

As you can see, We write a simple example. Can you guess what will this code do?

Here is code preview -

Screenshot

Okay, in your Previous example we change the color of the text. This is NOT! the end.
We can change anything of an element. Let's do something crazy think.

                
<p style="color:red; background-color: gray; font-size: 25px;"> Lorem ipsum dolor sit amet. </p>                       
            

Code preview

Screenshot

As you can see we change the background color of the text. if You look carefully, you will see some white space around the text. This is padding/margin witch added by the browser.

I think it's time to watch a video about HTML style.