Wednesday, March 2, 2016

HTML5 Elements in Action !

HTML5 - Elements in Action ! 
 
Here is a code snippet that shows usage of all the HTML5 elements 
as described in my previous article:
http://hetalparikh.blogspot.com/2016/03/html-5-elements.html
 
Code Snippet 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML 5 Elements</title>
</head>
<body>
    <!--Header Elements -->
    <header>
            <h1>HTML5 Elements</h1>
            <h2>Wonders of Web 2.0</h2>
    </header>
    <!--Nav Element-->
    <nav>
        <ul>
            <li><a href="www.google.com">Google</a></li>
            <li><a href="www.yahoo.com">Yahoo</a></li>
        </ul>
    </nav>
    <!--Article Element -->
    <article>
        <h3>Dr Suess famous quotes</h3>
        <!--Section Element -->
        <section>
            Today you are you! That is truer than true! There is no one alive who is you-er than you!
        </section>
        <section>
            The more that you read, the more things you will know. The more that you learn, the more places you'll go.
        </section>
        <section>
            Don't cry because it's over. Smile because it happened.
        </section>
        <!--Aside Element-->
        <aside>
            <p><!-- Since this aside is contained within an article,
            a parser should understand that the content of this aside
            is directly related to the article itself. --></p>
            <h3>Glossary</h3>
            <b>Dr. Seuss</b>
            <div>Theodor Seuss Geisel was an American writer and</div>
            <div>illustrator best known for authoring popular</div>
            <div>children's books under the pen name Dr. Seuss (/suːs/).</div>
            <div>His work includes several of the most</div>
            <div>popular children's books of all time,</div>
            <div>selling over 600 million copies and being translated into</div>
            <div>more than 20 languages by the time of his death.</div>
            <p></p>
        </aside>
    </article>
    <!--Footer Element-->
    <footer>
        Info: Content Copyright - Hetal Parikh
    </footer>
</body>
</html>