Vissa kanske undrar hur man ändrar på färg på meny flikarna när man drar musen över, detta ändrar man i stilmallen, man kan ändra till vilka färger man vill på bakgrund, text och ram.

Exempel:



1. Kopiera denna koden och lägg den längst ner i din stilmall:

#navbar { margin: 0; padding: 0; height: 1em; } #navbar li { list-style: none; float: left; } /* Ändra till right om du vill ha menyn till höger istället*/ #navbar li a { display: block; padding: 7px 24px; background: #000000; /*Ändra färgen på menyflikarna här*/ border-right: 1px solid #ffffff; color: #ffffff; /*Ändra färgen på texten här*/ text-decoration: none; font-family:arial; /*Ändra typsnittet här*/ font-size: 12px; } /*Ändra storleken på texten här*/ #navbar li a:hover { color: #333333; background:#ffffff; } /*Ändra färgen när man håller musen över undermenyn*/

2. Kopiera denna koden:

<ul id="navbar"> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> <li> <a href="länk" mce_href="/922173/entries/article/73718302/Länk"> Kategori </a> </li> </ul>

3. Klistra in i kodmallen efter denna koden: (om du redan har en horisontell meny behöver du ej göra detta)



4. Nu ska får du lägga in dina kategorier eller vad du ska ha där det står "kategori" och "länk"
Mer info om detta har jag förklarat i detta inlägget [Länk]

5. Nu ska du gå in i din stilmall och gå till den kod som du klistrat in, här kommer lite förklaring hur du ändrar utseende på menyn:

#navbar {
margin: 0;
padding: 0;
height: 1em; }
#navbar li {
list-style: none;
float: left; } /* Ändra till right om du vill ha menyn till höger istället*/
#navbar li a {
display: block;
padding: 7px 24px; <----ökar avståndet mellan "kategorierna" och höjden
background: #000000; /*Ändra färgen på menyflikarna här*/ <----ändra  bakgrunds färg på hela menyn
border-right: 1px solid #ffffff; <---ändra färg på linjen mellan varje kategori
color: #ffffff; /*Ändra färgen på texten här*/
text-decoration: none;
font-family:arial ; /*Ändra typsnittet här*/
font-size: 12px; } /*Ändra storleken på texten här*/
#navbar li  a:hover {
color: #333333; <---ändra färg på texten vid mouseover
background:#ffffff; } <------ändrar färg vid mouseover