CSS tutoriale

<div id=”navicontainer”>

<ul id=”navilist”>

<li id=”active”><a href=”#” id=”current”>Link jeden</a>

<ul id=”subnavlist”>

<li id=”subactive”><a href=”#” id=”subcurrent”>Link w submenu </a></li>

<li><a href=”#”>Link w submenu</a></li>

<li><a href=”#”>Link w submenu</a></li>

</ul>

</li>

<li><a href=”#”>Link dwa </a></li>

<li><a href=”#”>Link trzy </a></li>

</ul>

</div>

CSS

#navicontainer { margin-left: 30px; }

#navicontainer ul

{

margin: 0;

padding: 0;

list-style-type: none;

font-family: verdana, arial, Helvetica, sans-serif;

}

#navcontainer li { margin: 0 0 1px 0; }

#navicontainer a

{

display: block;

padding: 5px 10px;

width: 140px;

color: #fff;

background-color: #036;

text-decoration: none;

}

#navicontainer a:hover

{

color: #fff;

background-color: #69C;

text-decoration: none;

}

#navicontainer ul ul li { margin: 0 0 1px 0; }

#navicontainer ul ul a

{

display: block;

padding: 5px 5px 5px 30px;

width: 125px;

color: #fff;

background-color: #369;

text-decoration: none;

}

#navicontainer ul ul a:hover

{

color: #fff;

background-color: #69C;

text-decoration: none;

}