Enkel drop down meny
<div id="header">
lägger du till följande:
<ul id="dropdown">
<li><a href="#">KATEGORI 1</a>
<ul>
<li><a href="http://www.blogghjalparn.blogg.se">Designhjälp</a></li>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
</ul>
</li>
<li><a href="#">KATEGORI 2</a>
<ul>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
</ul>
</li>
<li><a href="#">KATEGORI 3</a>
<ul>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
<li><a href="LÄNKADRESS">LÄNKENS NAMN</a></li>
</ul>
</li>
<li><a href="#">KATEGORI 4</a></li>
</ul>
3. SPARA KODMALL!
4. Nu klickar du in dig på "redigerastilmall"
5. Längst ned i stilmallen kopierar du och klistrar in följande:
#dropdown {
background: #FFF url();
float: center;
padding: 0px;
color:#000;
margin-top: 0px;
width: 100%;
}
#dropdown li {
background: #FFF url();
float: left;
list-style: none;
padding-top:5px;
position: relative;
height:27px;
width:120px;
text-align:center;
}
#dropdown li:hover {
background: #ccc url();
text-align:center;
}
#dropdown li a {
font-family: Arial, Helvetica, Sans-serif;
font-size: 12px;
font-weight: bold;
color: #000;
padding:10px;
text-transform: uppercase;
text-decoration:none;
}
#dropdown ul {
background: #ccc url();
display: none;
margin: 0;
padding: 0;
position: absolute;
top: 20px;
left: 0px;
z-index: 500;
}
#dropdown ul {
background: #ccc url();
position: absolute;
}
#dropdown li:hover ul {
background: #ccc url();
display: block;
margin-top:12px;
}
7. "Spara stilmall" när du är klar!
8. Nu har du en dropdown meny under headern men utan länkar. Så klicka dig till "kodmallar" igen och koden du klistra in där förut. Lägg nu in länkarna du vill ha i meyn.
Där det står LÄNKADRESS skriver du in själva länken t.ex http://www.blogghjalparn.blogg.se . OBSERVERA att du måste ha med https:// eller http:// innan www. ! Annars kommer inte länken funka.
Där det står LÄNKENS NAMN skriver du in t.ex Designhjälp!
9. "Spara kodmall".
För att få fler länkar under t.ex KATEGORI 2 så lägger du till <li><a href="EN TILL LÄNKADRESS">NYA LÄNKENS NAMN</a></li> mellan <ul> och </ul> såhär:
Vill du ha en till kategori lägger bara till följande: