-->

  • HTML styles




    HTML Style Attribute

     The HTML Style Attribuete has the following syntax : 

    <tagname style="property:value;">

    The Property is a CSS property. The value is a CSS value.

    NOTE: You will learn more about CSS later in this Tutorial.

    -----------------------------------------------------------------------------------------------------------------------


    HTML Background Color

     The background-color property defines the background color for an HTML element.
    The example set the background color for a page to Green.
    Example
    <!DOCTYPE html>
    <html>
    <head>
    <title>Background-color</title>
    </head>

     <body style="background-color:green;">

     <h1>This is heading1</h1>
    <p>This is paragraph</p>

     </body>
    </html>

    Result 




    -----------------------------------------------------------
    HTML Text Color

     The Color Property defines the text color for an HTML element: 
    Example

    <!DOCTYPE html>
    <html>
    <head>
    <title>Text Color</title>
    </head>

     <body style="background-color:green;">

     <h1 style="color:blue;">This is a heading.</h1>
    <p style="color:red;">This is a paragraph.</p>

     </body>
    </html>

    Result

    This is a heading

    This is a paragraph.


    ----------------------------------------------------------------------------------------------------------------------
    HTML Text Size


    The font-size property defines the text size for an HTML elements;


     Example
    <!DOCTYPE html>
    <html>
    <head>
    <title>Font Size</title>
    </head>

     <body style="background-color:green;">

     <h1 style="font-size:400%;">This is a heading.</h1>
    <p style="font-size:200%;">This is a paragraph.</p>

     </body>
    </html>

                           HTML  Font Size Video                         





    Result 


     -------------------------------------------------------------------------------

    HTML Fonts 


    The font-family property defines the font to be used for an HTML element :
    Example 

     <!DOCTYPE html>
    <html>
    <head>
    <title>Font Size</title>
    </head>

    <body style="background-color:green;">

    <h1 style="font--family:verdana;">This is a heading.</h1>
    <p style="font-family:courier;">This is a paragraph.</p>

    </body>


    </html>


    Result

     This is a heading.

     This is a paragraph.


    -----------------------------------------------------------------------------------------------------------



     Web Best Fonts 

     1) Arial Header
    2) Halvetica Header
    3) Times New Roman Header
    4) Courier New Header
    5) Verdana Header
    6) Georgia Header
    7) Trebuchet Header
    --------------------------------------------------------------------------

     HTML Text Alignment


    The text alignment property defines the horizontal text alignment for an HTML element.

     Example
    <!DOCTYPE html>
    <html>
    <head>
    <title>Font Size</title>
    </head>

    <body style="background-color:green;">

    <h1 style="text-align:center;">This is a heading.</h1>
    <p style="text-align:center;">This is a paragraph.</p>

    </body>



    </html>

    Result 
    This is a heading.
    This is a paragraph
    ------------------------------------------------------------------------------


    Chapter Summary

    • Use the style attribute for styling HTML elements
    • Use background-color for background color
    • Use color for text colors
    • Use font-family for text fonts
    • Use font-size for text sizes
    • Use text-align for text alignment

     For More Information Watch This Video 

    • 0 comments:

    Post a Comment

    For Any Tech Updates, Hacking News, Internet, Computer, Technology and related to IT Field Articles Follow Our Blog.