Setting Up the HTML Code


Although tables can be used to create HTML page layouts, they are not ideal. Pages laid out with tables are often much larger in size due to the additional markup that is required. They are also less flexible, so it is harder to move sections of the layout without restructuring the markup completely.

CSS-based layouts, on the other hand, are generally smaller in file size and much more flexible.

The HTML code for this lesson is comprised of seven main containersan <h1> element and six <div> elements as shown in Listing 21.1.

Listing 21.1. HTML Code Containing the Markup for a Three-Column Layout
 <h1>     Sitename </h1> <div >     <div >         <div >             <h2>                 Page heading             </h2>             <p>                 Lorem ipsum dolor sit amet...             </p>         </div>         <div >             <h3>                 News             </h3>             <p>                 Lorem ipsum dolor sit amet...             </p>         </div>         <div >             <h3>                 Sections             </h3>             <ul>                 <li><a href="#">Home</a></li>                 <li><a href="#">About us</a></li>                 <li><a href="#">Services</a></li>                 <li><a href="#">Staff</a></li>                 <li><a href="#">Portfolio</a></li>                 <li><a href="#">Contact us</a></li>             </ul>         </div>         <div >             Copyright &copy; Sitename 2005         </div>     </div> </div> 




Sams Teach Yourself CSS in 10 Minutes
Sams Teach Yourself CSS in 10 Minutes
ISBN: 0672327457
EAN: 2147483647
Year: 2005
Pages: 234
Authors: Russ Weakley

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net