html 5ページ構造

2420 ワード

<!DOCTYPE html>
<html>
  <!--    -->
  <head>
    <title>HTML5    </title>
    <meta charset = "UTF-8" />
    <span style="color:red;font-style:italic;">
           </span>
    <hr>
  </head>
  <body>
    <!--    -->
    <aside style="font-size:larger;font-style:italic;color:blue;float:right;width:120px;">
      HTML5      .
    </aside>
    <!--    -->
    <nav>
      <a href="/Baking/" target="_blank">  1</a> |
      <a href="/ingredients/" target="_blank">  2</a> |
      <a href="/mixing/" target="_blank">  3</a> |
      <a href="/toppings/" target="_blank">  4</a>
    </nav>
    <!--    -->
    <figure>
      <img src="picture.jpg" width="170" height="128" />
    </figure>
    <!--[h1] [h6]  -->
    <hgroup draggable="true">
      <h1>h1</h1>
      <h2>h2</h2>
      <h2>h3</h2>
    </hgroup>
    <p>
      This specification defines the 5th major version, first minor revision of the core language of the World Wide Web: the Hypertext Markup Language (HTML).
    </p>
    <p>
      In this version, new features continue to be introduced to help Web application authors, new elements continue to be introduced based on research into prevailing authoring practices, and special attention continues to be given to defining clear conformance criteria for user agents in an effort to improve interoperability.
    </p>
    <!--         -->
    <article>
      <section id="mixing">
        <h2>The proper way to mix ingredients</h2>
        <p>When using a stand-mixer, it is important that you do not over mix the
        ingredients...</p>
      </section>
      <section id="baking">
        <h2>Proper baking techniques</h2>
        <p> It is important that you bake your cheesecake using a lot of moisture in the
        oven...</p>
      </section>
    </article>
  </body>
  <!--    -->
  <footer> © 2012 - fwwdn - All rights reserved </footer>
</html>