HTML STYLES

 

Html styles are used to style HTML elements it also means changing default values. 

Syntax: 

<tagname style="property: value; property: value">

Background color: 

<! DOCTYPE html> 

<html> 

        <head>

            <title> style=background color </title>

        </head>

        <body style="background-color:yellow">

                <p> Hello World </p>

        <body>

<html>


Output

 Hello World                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 


Text color

<! DOCTYPE html> 

<html> 

        <head>

            <title> style=text color </title>

        </head>

        <body>

                <p style="color:red"> My color is Red </p>

                <p style="color:green"> My color is green </p>

                <p style="color:blue"> My color is blue </p>

                <p style="color:yellow"> My color is yellow </p>

        <body>

<html>


Output:

 My color is Red
 My color is green
 My color is blue
 My color is yellow

Text font-family 

<! DOCTYPE html> 

<html> 

        <head>

            <title> style=text font family </title>

        </head>

        <body>

                <p style="font-family:courier"> I am a caurier </p>

        <body>

<html>


Output:
 
I am a caurier

Text sizing 

<! DOCTYPE html> 

<html> 

        <head>

            <title> style=font sizing </title>

        </head>

        <body>

                <p style="font-sizing:20px"> My size is 20 px </p>

                <p style="font-sizing:50px"> My size is 50 px </p>

        <body>

<html>


Output:

My size is 20 px 
My size is 50 px 

Text Alignment

<! DOCTYPE html> 

<html> 

        <head>

            <title> style= "text-alignment" </title>

        </head>

        <body>

                <p style="text-align:left"> left </p>

                <p style="text-align:center"> center </p>

                <p style="text-align:right"> right </p>

        <body>

<html>



Output:

left
                      center
                                              right