1. Computing

Discuss in my forum

Free Web Template: 2 Column Web Page in HTML 5

The XHTML

By

Copy the XHTML into your HTML editor. Be sure to not copy the advertisement copy that may appear within the code.

 <!doctype html>
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <title>Sample 2 Column Web Page Written in HTML 5</title>
 <link type="text/css" href="styles.css" />
 </head>
 <body>
 <header>
 <hgroup>
 <h1>Sample 2 Column Web Page</h1>
 <h2>Written in HTML 5</h2>
 </hgroup>
 </header>
 <section>
 <article>
 <p>This is the main body of the page. It is inside the article tag.</p>
 <p>Ut enim ad minim veniam, duis aute irure dolor lorem ipsum dolor sit amet. Ullamco laboris nisi qui officia deserunt eu fugiat nulla pariatur. Sunt in culpa excepteur sint occaecat quis nostrud exercitation. Ut enim ad minim veniam, sed do eiusmod tempor incididunt mollit anim id est laborum.</p>
 <p>Duis aute irure dolor qui officia deserunt sunt in culpa. Cupidatat non proident, eu fugiat nulla pariatur. In reprehenderit in voluptate ut aliquip ex ea commodo consequat. Ut enim ad minim veniam, sed do eiusmod tempor incididunt lorem ipsum dolor sit amet.</p>
 <figure>
 <img src="shasta_with_disc.jpg" alt="Shasta - a sample figure" style="border:none; width:200px;" /><br/>
 <legend>A Photo of my dog, acting as a sample figure</legend>
 </figure>
 <p>Duis aute irure dolor mollit anim id est laborum. Cupidatat non proident, velit esse cillum dolore ut aliquip ex ea commodo consequat. In reprehenderit in voluptate qui officia deserunt mollit anim id est laborum. Quis nostrud exercitation ullamco laboris nisi ut enim ad minim veniam. Ut labore et dolore magna aliqua.</p>
 <p>Quis nostrud exercitation ut enim ad minim veniam, consectetur adipisicing elit. Sed do eiusmod tempor incididunt excepteur sint occaecat mollit anim id est laborum. Velit esse cillum dolore quis nostrud exercitation ullamco laboris nisi.</p>
 <p>Qui officia deserunt eu fugiat nulla pariatur. Mollit anim id est laborum. Velit esse cillum dolore lorem ipsum dolor sit amet, sed do eiusmod tempor incididunt. In reprehenderit in voluptate consectetur adipisicing elit. Duis aute irure dolor in reprehenderit in voluptate ut labore et dolore magna aliqua.</p>
 <p>Excepteur sint occaecat consectetur adipisicing elit, sunt in culpa. Ut enim ad minim veniam, duis aute irure dolor sed do eiusmod tempor incididunt. Quis nostrud exercitation excepteur sint occaecat consectetur adipisicing elit. Ut aliquip ex ea commodo consequat. Velit esse cillum dolore eu fugiat nulla pariatur.</p>
 </article>
 <nav>
 <ul>
 <li><a href="#">Home</a></li>
 <li><a href="#">About</a></li>
 <li><a href="#">Articles</a></li>
 <li><a href="#">Contact Us</a></li>
 </ul>
 </nav>
 </section>
 </body>
 </html> 

You are free to use any of the free Web templates here for personal or commercial designs, either in print or on the Web, excluding items for resale. You may not give away, sell, or redistribute the files in any way. Do not post these files on any another website, electronically distribute them, or include them in any package for distribution. If you find these files useful, please include a credit line or a link back to this site [http://webdesign.about.com/]. Terms of use last modified 12/07/2008.

Return to 2 Column Web Page in HTML 5

More XHTML CSS Layout Templates

©2014 About.com. All rights reserved.