CSS-Formatierung von Sitemaps, Beispiel 8

Das Style-Sheet dieser Seite:

body {
   font: 15px sans-serif;
   background-color: #fff;
   color: #000;
   padding: 0;
   margin: 0;
   }

DIV#sitemap {
   padding: 1em 1.5em;
   line-height: 22px;
   }

DIV#sitemap LI {
   padding: 0 0 0 24px;
   margin: 0;
   list-style-type: none;
   }
DIV#sitemap LI {
   background: url(../../graphics/extm.gif)
               no-repeat
               0% 0%;
   }
DIV#sitemap LI.last {
   background: url(../../graphics/exlm.gif)
               no-repeat
               0% 0%;
   }
DIV#sitemap LI.file:before {
   content: url(../../graphics/exfilebw.gif);
   }
DIV#sitemap LI.file:before:hover {
   content: url(../../graphics/exfilecolor.gif);
   }
DIV#sitemap LI.folder:before {
   content: url(../../graphics/exfolderbw.gif);
   }
DIV#sitemap LI.folder:before:hover {
   content: url(../../graphics/exfoldercolor.gif);
   }
DIV#sitemap UL {
   padding: 0 0 0 24px;
   margin: 0 0 0 -24px;
   list-style-type: none;
   }
DIV#sitemap UL {
   background: url(../../graphics/exim.gif)
               repeat-y
               0% 0%;
   }
DIV#sitemap UL.last {
   background-image: none;
   }
DIV#sitemap LI LI {
   color: #000000;
   font-weight: normal;
   }
DIV#sitemap LI.folder:hover {
   color: goldenrod;
   font-weight: bold;
   }
DIV#sitemap LI.file:hover {
   color: mediumblue;
   font-weight: bold;
   }

Das HTML für die Sitemap:

<div id="sitemap">
<ul class="last">
<li class="folder">Abschnitt
    <ul>
    <li class="folder">Kapitel
        <ul>
        <li class="file">Unterkapitel</li>
        <li class="last file">Unterkapitel</li>
        </ul>
    </li>
    <li class="last folder">Kapitel
        <ul class="last">
        <li class="file">Unterkapitel</li>
        <li class="file">Unterkapitel</li>
        <li class="last file">Unterkapitel</li>
        </ul>
    </li>
    </ul>
</li>
<li class="last folder">Abschnitt
    <ul class="last">
    <li class="folder">Kapitel
        <ul>
        <li class="file">Unterkapitel</li>
        <li class="last file">Unterkapitel</li>
        </ul>
    </li>
    <li class="last folder">Kapitel
        <ul class="last">
        <li class="last file">Unterkapitel</li>
        </ul>
    </li>
    </ul>
</li>
</ul>
</div>