educative.html

<html>
 <head>
   <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.js"></script>
 </head>
 <body>
   <!-- Add semantic tags to this HTML -->
    <header>
        <hgroup>
            <h1>Learning Web Development</h1>
            <h2>A site dedicated to learning how to develop applications for the web.</h2>
        </hgroup>    
            
                <nav>
                    <ul>
                        <li><a href="">Home</a></li>
                        <li><a href="">About This Site</a></li>
                        <li><a href="">Contact Information</a></li>
                    </ul>
                </nav>
    </header>
   
    <article>
        <hgroup>
            <h1>Using Semantic HTML Elements</h1>
            <h2>A complete guide on indicating meaning for your web page's content</h2>
            <h3>December 18, 2017</h3>
        </hgroup>

        <table>
            <tr>
                <th>Name</th>
                <th>DOB</th>
                <th>Weight</th>
            </tr>

            <tr>
                <td>Mary</td>
                <td>12/13/1994</td>
                <td>130</td>
            </tr>
        </table>


    </article>
   
    <section>
        <h4><code>header</code></h4>
            <p>Use header elements for content that is consistent across your web page.</p>
            <p>Headers may also contain your site's navigation components.</p>
    </section>

   <section>
        <h4><code>nav</code></h4>
            <p>Use nav elements to store elements associated with site navigation.</p>
            <p>Navigational <code>anchor</code> tags are often wrapped in an unordered list element.</p>
    </section>
   

   <footer>
        <p>&copy; Educative.io 2017</p>
        <h4><code>footer</code></h4>
   </footer>

   
 </body>
</html>