[Løst] Hvordan to Spray Menu Bar med ulik design på en side?

[TanteGrønn]

Hei

 

Trenger sårt hjelp til hvordan en får til å ha to Spray menu bar med ulig design på en side(den ene skal fonten være rød og andre blå).

Har forstått det slik at en må kopiere css`n men forstår ikke hvordan jeg gjør dette?

Eller om det er en annen måte å gjøre det på....

 

?

[plakatmannen]

Hvilket program er det du lager siden din i? Dreamweaver?

 

Det du kan gjøre er å legge til en klasse på hver av menyene. F.eks

<ul class="blue"> ...menygreier...</ul>
<ul class="red"> ...menygreier...</ul>

 

Og deretter i CSS:

.red { color: red }
.blue { color: blue }

 

Herfra kan du også style underelementene i hver meny, f.eks bruke ".red a" for å style alle anker/lenke-tagger inni den røde menyen.

 

Lykke til.

[TanteGrønn]

Bruker Dreamweaver ja.

Men forstår ikke helt hvor jeg skal legge inn "< ul class" teksten i html koden.

Og når jeg skal velge å lage ny css så velger jeg da class, sant?

(er forøvrig "mouse over" teksten jeg ønsker i annen farge...)

 

<ul id="MenuBar2" class="MenuBarVertical">

<li><a class="MenuBarItemSubmenu" href="#">Øst-Norge</a>

<ul>

<li><a href="#">Hundepensjonat</a></li>

<li><a href="#">Kattepensjonat</a></li>

</ul>

</li>

</ul>

[agm]

Nå vet jeg ikke hvordan resten av siden ser ut, men om du legger til dette til sist i CSS-dokumentet, skal du forhåpentligvis se en forandring:

 

#menubar2 a:hover {
   color: red;
}

[hjahre]

Bruker Dreamweaver ja.

Men forstår ikke helt hvor jeg skal legge inn "< ul class" teksten i html koden.

Og når jeg skal velge å lage ny css så velger jeg da class, sant?

(er forøvrig "mouse over" teksten jeg ønsker i annen farge...)

 

<ul id="MenuBar2" class="MenuBarVertical">
	    <li><a class="MenuBarItemSubmenu" href="#">Øst-Norge</a>
		  <ul>
		    <li><a href="#">Hundepensjonat</a></li>
		    <li><a href="#">Kattepensjonat</a></li>
		  </ul>
	    </li>
	  </ul>

Det er ikke veldig mye som skal til for å få hover effekten til å ha annen farge. Hvis du skal ha mouseover på HTML-koden du postet blir det noe liknende dette

ul.MenuBarVertical > li > ul > li > a:hover {
   color: red;
}

/* eller */
/* Denne funker på alle a-elementer under ul-en med klasse MenuBarVertical */
ul.MenuBarVertical a:hover {
   color: red;
}

Mer om CSS finner du på W3Schools.com og W3C