Avatar billede anders02 Nybegynder
06. april 2007 - 13:04 Der er 6 kommentarer og
1 løsning

Nøjagtig styring af links farver i forsk. grupper driller?

Hej

Jeg sidder og bakser med nogle links-farver.

Jeg undrer mig lidt. Jeg ville først lave links med "normale" farver, altså de på forhånd indstillede om til noget, jeg selv valgte, og bagefter ville jeg lave en udvalgt gruppe af links med specielle farver.

jeg har læst i forskellige manualer, men jeg synes simpelthen ikke, at det virker "efter bøgerne". Der er nok lavet noget om, med undtagelser osv., i tidens løb, og det er måske det, jeg søger lidt forklaring på.

Jeg har lavet en special-regel, og jeg skriver i head´en sådan her:

<style type="text/css">
A.special:link{
color: black;
}
A.special:active{
color: green;
}
A.special:visited{
color: red;
}
</style>

Desuden kalder jeg a med class="special". Resultat: Alle - også de ubesøgte links - bliver røde, selvom det altså KUN var de links, der var blevet besøgt, der skulle være røde!

Hvad hulen går galt?

Nogle manualer mener også, at man ikke kan bruge A:hover, og at der i øvrigt i stylesheetet skal være en rækkefølge sådan her, ellers går det også galt:
A: link
A: visited
A: hover
A: active

Ved nogen noget om det her? Jeg vil gerne lave dels anderledes farver end de på forhånd indstillede på links, og så vil jeg lave anderledes farver på en (eller flere udvalgte) grupper af links.

Jeg vil gerne - i teorien - kunne styre alle fire muligheder, men ved nogen, om det simpelthen er umuligt i praksis, fordi browserne er lidt forskellige, fordi nogle slags aktiveringer alligevel ikke virker i praksis eller hvad?

Er det vigtigt i stylesheetet, om man skriver "a" med a eller A?

Mvh anders02
Avatar billede roenving Novice
06. april 2007 - 13:24 #1
Det sidste først: css er principielt case-insensitive, men da andre dele af dhtml er stærkt case-sensitive er det en god regel kun at bruge en type, og f.eks. i xhtml er det et must, at den slags skal være med små bogstaver, og da det er nemmest at huske at gøre det samme, kan jeg kun anbefale, at du holder dig til de små bogstaver !-)

-- rækkefølgen af pseudo-selektorer kan _kun_ være den, du viser, da css så at sige er doven og læser 'bagfra', så visited vil have forrang for active i det viste stylesheet ...

(Rent faktisk sker der det, at en tidligere regel overskrives af en senere, hvis der er sammenfald i den property, der adresseres !-)

-- og den gode måde at lave grupperede links (eller andre ting, er at sætte en speciel klasse på et _omkransende_ element, så f.eks.

<style type="text/css">
a:link{
color: black;
}
a:visited{
color: red;
}
a:hover{
color: yellow;
}
a:active{
color: green;
}
.speciel a:link,.speciel a:visited{color:black;text-decoration:underline overline;}
.speciel a:hover,.speciel a:active{color:red;text-decoration:none;}
</style>

<div class="speciel">
  <a href=" ... ">Link inde i et specielt element</a><br><br>
  <a href=" ... ">Link inde i et specielt element</a><br><br>
</div>
<a href=" ... ">Link udenfor det specielle element</a>
Avatar billede anders02 Nybegynder
07. april 2007 - 10:37 #2
Hej roenving

Tak for svar, men der er fortsat nogle ting, der driller ...

For det første: gælder det lige så vel i td som i div?

For det andet, så er der fortsat nogle farver, der driller (jeg har IE7, men det skulle vel ikke gøre en forskel?)

Det specielle link er bare rødt i stedet for sort, når det er besøgt!
Det bliver også gult (!), når man holder musen hen over, og grønt(!), når man trykker på det specielle link, så der er fortsat noget, der driller.

Og de ikke-specielle links skifter farver fra rød til grøn, når man trykker på det andet af de to links - og det gælder for dem begge to! Mens de gule og grønne farver er fraværende her.

Har du nogen råd til det?

Mvh anders02
Avatar billede anders02 Nybegynder
07. april 2007 - 10:47 #3
Hej igen-igen

Inde på html.dk foreslår de som i det nedenstående, men det virker i praksis vist heller ikke sådan, som det skulle "ifølge bogen"!:

a:link {
    color: blue;
    text-decoration:none;
}
a:visited {
    color: purple;
    text-decoration:none;
}
a:active {
    background-color: yellow;
    text-decoration:none;
}
a:hover {
    color:red;
    text-decoration:none;
}

Mvh anders02
Avatar billede roenving Novice
07. april 2007 - 11:45 #4
Tjah, selv for html.dk er det en tåbefejl, hvis der er byttet rundt på :active og :hover, for det er en forkert rækkefølge ...

-- men sådan er så indtryket ved at besøge det site, forvent, at du skal aflære meget af det de skriver, for det er proppet med fejl, misforståelser, fejlfortolkninger oma.

-- og så gælder den slags for _alle_ slags elementer (det er selve grundlaget i cascading, og årsagen til, at det hedder css, Cascading StyleSheets !-)

-- farverne kommer da rigtigt frem hos mig, men måske er det forvirrende, at rækkefølgen i html-koden er den omvendte af css-koden ...
Avatar billede anders02 Nybegynder
13. april 2007 - 08:50 #5
Hej roenving
Smid lige et svar, så jeg kan give dig points!

Mvh anders02
Avatar billede roenving Novice
13. april 2007 - 14:35 #6
Velbekomme '-)
Avatar billede roenving Novice
17. april 2007 - 01:12 #7
-- og tak for point ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester