15 svar · 518 visningar · startad av mlibemelie
Hej!
Jag skulle vilja att den länken som är aktiv ser ut på ett speciellt sätt så att man ser vilken länk man är på. Förstår ni hur jag menar?
Är det ngn som har ngt förslag på hur man kan göra så är jag tacksam :)
Allt ska göras i CSS såklart ;)
I CSS-filen definierar du vilken länkfärg du vill ha, tex:
a:link { /*link - länk som ännu inte har besökts*/
color: #3366FF;
}
a:visited { /*visited - länk som har besökts*/
color: #CCCCCC;
}
a:hover { /*hover - mouseover*/
color: #FFCC66;
}
a:active { /*active - vid klick*/
color: #FF0000;
}
Finns några olika sätt. T.ex. att du ger varje länk ett eget id. Men du lägger INTE in formateringen i stilmallen, utan i <head> på motsvarande sida.
Alltså:
<head><style type="css/text">
#link1 {
background-color:#CCC;
}
</head><body>
<a href="sidan1" id="link1">Sidan 1</a>
<a href="sidan2" id="link2">Sidan 2</a>
<a href="sidan3" id="link3">Sidan 3</a>
Jo asså det där vet jag men jag undrar liksom hur man får en länk att se ut på ett sätt när man är inne på den aktuella sidan.
Jag trodde först att det var a:active men den visar ju bara hur länken ser ut när man håller musen nedklickt. Jag vill att länken ska ändras när man släpper musen också.
Danne V: Aha okej tack så mycket, ska testa det där :)
Hmm jag får det inte riktigt att funka. Har gjort som du sagt och la in mallen i dokumentet. Men det blir ingen skillnad ändå.
Så här ser css mallen för länkarna ut:
a:link {
color: #000;
text-decoration: none;
}
a:visited {
color: #000;
text-decoration: none;
}
a:hover {
color: #FFFFFF;
padding: 3px 3px 16px;
background-image: url(Bilder/pattern_137.gif);
}
a:active {
color: #000;
text-decoration: none;
background-color: #FFE9CB;
}
du kanske måste skriva:
#link1 a {
blablabla
}
i stilen som ligger i huvvet.
EDIT:
Tror du missuppfattat en av de där fyra formerna av anchor-taggen (alltså "a").
a:active är bara det ögonblick när man klickar på länken. Det har inget att göra med vilken sida man har öppen eller så.
Danne V skrev:
du kanske måste skriva:
#link1 a {
blablabla
}i stilen som ligger i huvvet.
EDIT:
Tror du missuppfattat en av de där fyra formerna av anchor-taggen (alltså "a").
a:active är bara det ögonblick när man klickar på länken. Det har inget att göra med vilken sida man har öppen eller så.
Okej får testa det.
Angående a:active: Nä jag vet hur den funkar, kanske bara uttryckte mig konstigt ;)
Du vill alltså att den länk i navigeringsmenyn som representerar den sida man är på för tillfället ska se ut på ett visst sätt?
Äsch det verkar inte funka.
Kanske är för krångligt då :S
Adestro skrev:
Du vill alltså att den länk i navigeringsmenyn som representerar den sida man är på för tillfället ska se ut på ett visst sätt?
Aa precis :)
Jag tror du missförstår vad jag skrivit. Det är absolut inte komplicerat. Tvärtom, ganska enkelt och självklart.
Säg att du har en sida som heter "1.html".
I länken (menyn) som går till den sidan skriver du "id="sida1" (alltså: <a href="sida1.html" id="sida1"....
I head på samma sida ger du den stil du vill att sidan ska ha när den är öppen.
#sida1 a {
}
Sätt ett ID på den länk i menyn som representerar den sida du står på. T.ex. på startsidan sätter du ID't på dess länk i menyn, på "Om mig"-sidan sätter du ID't på dess länk i menyn. Sen i en extern stilmall beskriver du ID't. T.ex. "#currentPage { background-color: #ffffff;}", så får texten i länken vars sida du står på vit bakgrund.
Har du bilder som länkar blir det ju lite mer, med olika ID för varje länk, finns säkert smidigare sätt med Javascript isåfall...
Danne V skrev:
Jag tror du missförstår vad jag skrivit. Det är absolut inte komplicerat. Tvärtom, ganska enkelt och självklart.
Säg att du har en sida som heter "1.html".
I länken (menyn) som går till den sidan skriver du "id="sida1" (alltså: <a href="sida1.html" id="sida1"....
I head på samma sida ger du den stil du vill att sidan ska ha när den är öppen.
#sida1 a {
}
Vill hon ha olika utseende på alla element är det ju korrekt, men ska varje "öppen" länk formeteras lika är det ju onödigt med flera ID...
Hur får du in menyn på sidan? Är det med include av någon sort eller finns menyn på varje sida?
Förslag om menyn finns i html dokumentet, då skriver du in den aktuella sidlänken med en class t.ex
#menu li.current{
color:#000;
background:#b5da69;
}
och sedan i menyn
<li class="current"><a href="">hem</a></li>
Använder du "include" så ser det annorlunda ut...
Var visst sent ute :)
Danne V: Jag förstod hela tiden vad du menade men jag fick det inte att funka.
Men nu när jag tog och gjorde om det så funkade det faktiskt :)
Tack så mycket alla andra också! Nu är det fiint :D
mlibemelie skrev:
Danne V: Jag förstod hela tiden vad du menade men jag fick det inte att funka.
Men nu när jag tog och gjorde om det så funkade det faktiskt :)Tack så mycket alla andra också! Nu är det fiint :D
Bra...
Det brukar gå bättre om man testar en gång till om nåt inte funkar. Man har en förmåga att glömma små men viktiga grejer.