Advanced Search

HTML5 Beginers Layout With Google Ajax Load

/ Published in: HTML
Save to your folder(s)
Basic HTML5 layout for beginners

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8" />
  5.     <title>HTML5 Beginers Layout</title>
  6. <script type="text/javascript" src="http://www.google.com/jsapi"></script>
  7. <script type="text/javascript">
  8. google.load("jquery", "1.4.2");
  9. google.load("jqueryui", "1.8.2");
  10. </script>
  11. <!--[if lt IE 9]>
  12. <script type="text/javascript" src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  13. <![endif]-->
  14. </head>
  15. <body>
  16.     <header>
  17.         <hgroup>
  18.             <h1>Page Header</h1>
  19.             <h2>Description May Go Here</h2>
  20.         </hgroup>
  21.     </header>
  22.  
  23.     <nav>
  24.         <ul>
  25.             <li><a href="#">Home</a></li>
  26.             <li><a href="#">Contact</a></li>
  27.         </ul>
  28.     </nav>
  29.  
  30.     <article>
  31.         <header>
  32.             <h1>Article Header</h1>
  33.             <time datetime="2010-05-05" pubdate>June 25th 2010</time>
  34.         </header>
  35.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  36.         <section>
  37.             <header>
  38.                 <h1>Section Header</h1>
  39.             </header>
  40.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  41.             <footer>
  42.                 <p>Section Footer</p>
  43.             </footer>
  44.         </section>
  45.         <footer>
  46.             Article Footer
  47.         </footer>
  48.     </article>
  49.  
  50.     <aside>
  51.         <header>
  52.             <h1>Siderbar Header</h1>
  53.         </header>
  54.         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  55.     </aside>
  56.  
  57.     <footer>
  58.         Page Footer
  59.     </footer>
  60.  
  61. </body>
  62. </html>

URL: http://plan-zero.org

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.