Advanced Search

Return to Snippet

Revision: 15589
at July 10, 2009 17:41 by visualisierte
Initial Code 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

<head>
	<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
	<title>Navigation</title>
	<style type="text/css">
	  /*<![CDATA[*/
	  *
	  {
	    margin: 0;
	    padding: 0;
	  }
	  
	  body
	  {
	    height: 100%;
	  }
	  
	  ul
	  {
	    position: relative;
	    width: 185px;
	    background: white;
	  }
	  
	  ul li
	  {
	    list-style-type: none;
	    width: 185px;
	  }
	  
	  ul li a
	  {
	    display: block;
	    width: 185px;
	    padding-top: 30px;
	    padding-bottom: 30px;
	    border-bottom: 1px solid #efefef;
	  }
	  
	  ul li a span
	  {
	    display: block;
	    margin-left: 20px;
	  }
	  
	  #firstLevel ul li
	  {
	    display: block;
	    background: #cdcdcd;
	  }
	  
	  #firstLevel  ul li a /* style for secondLevel*/
	  {
	    border-bottom: 1px solid black;
	    background: #8c624a;
	    
	  }
	  
	  #secondLevel  ul li a /* style for thirdLevel*/
	  {
	    background: #469b4a;
	  }
	  
	  #thirdLevel  ul li a /* style for fourthLevel*/
	  {
	    background: #466a9b;
	  }

	  #firstLevel ul li a span /* style for secondLevel*/
	  {
	    margin-left: 30px;
	  }
	  
	  #secondLevel ul li a span /* style for thirdLevel*/
	  {
	    margin-left: 40px;
	  }
	  
	  #thirdLevel ul li a span /* style for fourthLevel*/
	  {
	    margin-left: 50px;
	  }
	  
	/*   span { 
	    left: -1000px;
	    top: -1000px;
	    overflow: hidden;
	    position: absolute;
	    } */
	  
	  /*]]>*/
	</style>
</head>
<body>
  <ul id="firstLevel"><!-- first level -->
    <li><a href="#" title="blank link 1"><span>link1</span><!--<br />--></a></li>
    <li><a href="#" title="blank link 1"><span>link1</span><!--<br />--></a></li>
    <li><a href="#" title="blank link 1"><span>link1</span><!--<br />--></a></li>
    <li><a href="#" title="blank link 1"><span>link2</span><!--<br />--></a>
      <ul id="secondLevel"><!-- second level -->
        <li><a href="#" title="blank link 2"><span>link2</span><!--<br />--></a></li>
        <li><a href="#" title="blank link 2"><span>link2</span><!--<br />--></a></li>
        <li><a href="#" title="blank link 2"><span>link2</span><!--<br />--></a></li>
        <li><a href="#" title="blank link 3"><span>link3</span><!--<br />--></a>
          <ul id="thirdLevel"><!-- third level -->
            <li><a href="#" title="blank link 3"><span>link3</span><!--<br />--></a></li>
            <li><a href="#" title="blank link 3"><span>link3</span><!--<br />--></a></li>
            <li><a href="#" title="blank link 3"><span>link3</span><!--<br />--></a></li>
            <li><a href="#" title="blank link 4"><span>link4</span><!--<br />--></a>
              <ul id="fourthLevel"><!-- fourth level -->
                <li><a href="#" title="blank link 4"><span>link4</span><!--<br />--></a></li>
                <li><a href="#" title="blank link 4"><span>link4</span><!--<br />--></a></li>
                <li><a href="#" title="blank link 4"><span>link4</span><!--<br />--></a></li>
              </ul><!-- fourth level -->
            </li>
          </ul><!-- third level -->
        </li>
      </ul><!-- second level -->
    </li>
    <li><a href="#" title="blank link 1"><span>link6</span><!--<br />--></a></li>
    <li><a href="#" title="blank link 1"><span>link1</span><!--<br />--></a></li>
    <li><a href="#" title="blank link 1"><span>link1</span><!--<br />--></a></li>
  </ul>
</body>
</html>
Initial URL 









Initial Description














Initial Title





verschachtelte navigation









Initial Tags














Initial Language





HTML