• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Project 10. Designing in the Garden > Laying the Groundwork

Laying the Groundwork

As always, we need to understand the document skeleton before we try to clothe it in CSS. The basic document skeleton is given in Listing 10.1.

Listing 10.1. The Document Skeleton

<body id="css-zen-garden">
<div id="container">
  <div id="intro">
    <div id="pageHeader">
      <h1><span>css Zen Garden</span></h1>
      <h2><span>The Beauty of <acronym
       title="Cascading Style Sheets">CSS</acronym> Design</span></h2>
    </div>
    <div id="quickSummary">
      [...content...]
    </div>
    <div id="preamble">
      <h3><span>The Road to Enlightenment</span></h3>
      [...content...]
    </div>
  </div>
  <div id="supportingText">
    <div id="explanation">
      <h3><span>So What is This About?</span></h3>
      [...content...]
    </div>
    <div id="participation">
      <h3><span>Participation</span></h3>
      [...content...]
    </div>
    <div id="benefits">
      <h3><span>Benefits</span></h3>
      [...content...]
    </div>
    <div id="requirements">
      <h3><span>Requirements</span></h3>
      [...content...]
    </div>
    <div id="footer">
      [...content...]
    </div>
  </div>
  <div id="linkList">
    <div id="linkList2">
      <div id="lselect">
        <h3 class="select"><span>Select a Design:</span></h3>
        [...list of links...]
      </div>
      <div id="larchives">
        <h3 class="archives"><span>Archives:</span></h3>
        [...list of links...]
      </div>
      <div id="lresources">
        <h3 class="resources"><span>Resources:</span></h3>
        [...list of links...]
      </div>
    </div>
  </div>
</div>
[...extra divs...]
</body>


					  


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint