---

Jeg har følgende span class:

<style>

link {color:#ffffff;text-decoration:none;a-hover:underline;}

</style>

Jeg bruger funktionen i en menu, men den vil ikke underline, når
jeg kører musen henover linksene. Jeg skriver vel kommandoen
forkert. Har forsøgt at skrive den på andre måder. Hvad gør jeg?

VH - JAN!

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

---

Jan Hansen <stemmen69@yahoo.dk> wrote:

> link {color:#ffffff;text-decoration:none;a-hover:underline;}

Det ser noget forkert ud.

Prøv i stedet med det her:

a {
   color: #fff;
   text-decoration: none;
}

a:hover {
   text-decoration: underline;
}

--
Anders Thorsen Holm, BSc i datalogi-multimedier.

Jeg søger fuldtidsjob i Århus - gerne studierelevant, men ingen
betingelse. Læs mit CV: http://www.thorsenholm.dk/cv/

---

> Prøv i stedet med det her:
>
> a {
....
> a:hover {

Hvis det kun er links du er interesseret i, så bør du skrive

a:link { ...
a:link:hover { ...

Ellers vil "a:hover" også matche fx
<a name="target">noget tekst at gå til</a>
i browsere der forstår CSS 2.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

---

Jan Hansen skrev:

> link {color:#ffffff;text-decoration:none;a-hover:underline;}

Ovenstående css-kode sætter style på <link>-elementer. Men normale
hyperlinks laves med <a>, ikke med <link> (der bl.a. bruges til
usynlige links).

Din "a-hover" i linjen ovenfor er også ugyldig. Bindestregen har
ikke nogen specialbetydning i css - så "a-hover" betyder bare
egenskaben "a-hover", der ikke findes i specifikationen.

Anders Thorsen Holm har givet et eksempel på en korrekt kode.
Indlægget her er blot ment som en forklaring på hvorfor din
eksisterende kode ikke virker efter hensigten.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

---

Det fungerer fortsat ikke. Jeg viser igen, hvad jeg gør og jeg
vil gøre opmærksom på, at jeg ikke vil bruge kommandoen i et
stylesheet. Der har jeg nemlig andre regler for links. Jeg vil
have 2 forskellige regler, hvorfor jeg bruger <span>:

<style type="text/css">
link
{color:#ffffff;text-decoration:none;a:link:hover:underline;}
</style>

OG SÅ:

<span class="link">her er linket, der skal blive underlinet, når
musen føres henover</span>

Håber, I kan hjælpe - gerne med en løsning, der gør at jeg kan
lave forskellige regler for links i et stylesheet, hvad jeg skal
gøre for at det bliver "læst adskilt", hvis I er med...

VH- JAN

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

---

Jan Hansen <stemmen69@yahoo.dk> wrote:

> Det fungerer fortsat ikke. Jeg viser igen, hvad jeg gør og jeg
> vil gøre opmærksom på, at jeg ikke vil bruge kommandoen i et
> stylesheet. Der har jeg nemlig andre regler for links.

Du kan da snildt have flere regler for links i samme style sheet,
uden at det giver problemer.

> Jeg vil have 2 forskellige regler, hvorfor jeg bruger <span>:

Span har intet som helst med links at gøre, og kan ej fungere som
sådan (i hvert fald ikke førend XHTML 2.0 bliver en udbredt
standard).

> <style type="text/css">
> link
> {color:#ffffff;text-decoration:none;a:link:hover:underline;}
> </style>

I ovenstående kode skriver du en (fejlfyldt) CSS-regel for <link>-
elementer.

> <span class="link">her er linket, der skal blive underlinet, når
> musen føres henover</span>

Hvis du vil matche elementer med klassen "link", skal reglen skrives
således:

..link {
   /* attributter her */
}

Bemærk dog, at det er en skidt ide at bruge "link" som klasse,
grundet navnesammenfaldet med <link>-elementet og :link-
pseudoklassen.

> Håber, I kan hjælpe - gerne med en løsning, der gør at jeg kan
> lave forskellige regler for links i et stylesheet, hvad jeg skal
> gøre for at det bliver "læst adskilt", hvis I er med...

Der er flere metoder:

1. Sæt en klasse på de relevante links:

<a href="foo.html" class="speciel">Et specielt link</a>
<a href="bar.html" class="speciel">Et andet specielt link</a>

a {
   text-decoration: none;
}

a.foo:hover {
   text-decoration: underline;
}


2. Sæt en klasse på et element uden om de relevante links:

<div class="speciel">
<a href="foo.html">Et specielt link</a>
<a href="bar.html">Et andet specielt link</a>
</div>
<a href="baz.html">Et normalt link</a>

a {
   text-decoration: none;
}

..speciel a:hover {
   text-decoration: underline;
}


3. Giv det omgivende element et id (unikt for siden og derfor
velegnet til menuer o.lign.):

<div id="menu">
<ul>
<li><a href="#">Punkt 1</a></li>
<li><a href="#">Punkt 2</a></li>
....
<li><a href="#">Punkt N</a></li>
</ul>
</div>

<div id="indhold">
<p>Her kommer <a href="#">et almindeligt link</a>.</p>
</div>

a {
   text-decoration: none;
}

a:hover {
   color: #f00;
}

#menu a:hover {
   text-decoration: underline;
}


--
Anders Thorsen Holm, BSc i datalogi-multimedier.

Jeg søger fuldtidsjob i Århus - gerne studierelevant, men ingen
betingelse. Læs mit CV: http://www.thorsenholm.dk/cv/

---

Anders Thorsen Holm <usenet@thorsenholm.invalid> wrote:

> 1. Sæt en klasse på de relevante links:
>
> <a href="foo.html" class="speciel">Et specielt link</a>
> <a href="bar.html" class="speciel">Et andet specielt link</a>
>
> a {
> text-decoration: none;
> }
>
> a.foo:hover {
> text-decoration: underline;
> }

Der skulle naturligvis stå

a.speciel:hover {
   text-decoration: underline;
}

til sidst.

--
Anders Thorsen Holm, BSc i datalogi-multimedier.

Jeg søger fuldtidsjob i Århus - gerne studierelevant, men ingen
betingelse. Læs mit CV: http://www.thorsenholm.dk/cv/

---

Sådan ser mit aktuelle stylesheet ud. Disse koder styrer links på
siden og skal ikke vedkomme linksene i min menu. De skal være
hvide og blive underlinede, når musen føres henover... Jeg har
fået anbefalet at give mit a-tag en class. Jeg har kaldt den
menu. Jeg har indsat det i mit sheet, men det virker ikke...

}
a:link {
color: #0029DA;
text-decoration:underline;
}

a:active {
color: #0029DA;
text-decoration:underline;
}
a:visited {
color: #0029DA;
text-decoration:underline;
}
FORSLAG:
a {
text-decoration: none;
}

a.menu:hover {
text-decoration: underline;

OG SÅ:

<A class="menu" href="forside.htm">FORSIDE</A>

Men det virker, som sagt, ikke...

Jeg må gøre noget forkert. Anders har givet gode idéer til andre
muligheder, men det ville være fedt at gøre det i CSS


--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

---

Jan Hansen wrote:
> Sådan ser mit aktuelle stylesheet ud. Disse koder styrer links på
> siden og skal ikke vedkomme linksene i min menu. De skal være
> hvide og blive underlinede, når musen føres henover... Jeg har
> fået anbefalet at give mit a-tag en class. Jeg har kaldt den
> menu. Jeg har indsat det i mit sheet, men det virker ikke...


a.menu:link, a.menu:visited, a.menu:active {
text-decoration: none;
}

a.menu:hover {
text-decoration: underline;

OG SÅ:

<a class="menu" href="forside.htm">FORSIDE</a>

Så skal det nok virke.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin

---

Jan Hansen <stemmen69@yahoo.dk> wrote:

> a:link {
> color: #0029DA;
> text-decoration:underline;
> }

Almindelige links får en farve og er understreget. Fint.

> a:active {
> color: #0029DA;
> text-decoration:underline;
> }

Aktive links har samme farve og er understreget. OK.

> a:visited {
> color: #0029DA;
> text-decoration:underline;
> }

Besøgte links har igen samme farve og er understreget. En anden
problemstilling, men stadig væsentlig: overvej, for overskuelighedens
skyld, at give besøgte links en anden farve.

> a {
> text-decoration: none;
> }

Her fjernes understregning igen fra samtlige links. Hvis det kun er
dine "menu"-links, der skal være uden understregning, skal du bruge
følgende regel i stedet for ovenstående:

a.menu {
   text-decoration: none;
}

> a.menu:hover {
> text-decoration: underline;

Og ved hover over menu-links kommer understregningen.

> <A class="menu" href="forside.htm">FORSIDE</A>

Det burde virke efter hensigen, hvis du foretager den ene rettelse
nævnt ovenfor.

> Anders har givet gode idéer til andre muligheder, men det ville
> være fedt at gøre det i CSS

For god ordens skyld: CSS kan ikke alene gøre det. CSS virker ud fra
dokumentets struktur. Når jeg skriver en regler som:

/* Almindelige links på siden er understreget og blå: */
a {
   text-decoration: underline;
   color: #00f;
}


/* Alle slags <a>-elementer, links som "target"-ankre i menuen er
uden understregning */
#menu a {
   text-decoration: none;
}

/* Links og aktive links i menuen er røde. */
#menu a:link, #menu a:active {
   color: #f00;
}

/* Besøgte links i menuen er grønne. */
#menu a:visited {
   color: #0f0;
}

/* Fører man musen over et link i menuen, bliver det understreget*/
#menu a:hover {
   text-decoration: underline;    
}

Vil de fire sidste regler kun påvirke <a>-elementer, der er "børn" af
et element med id "menu". Det kan f.eks. være:

<div id="menu">
<ul>
<li><a href="#">foo</a></li>
</ul>
</div>

eller

<p id="menu"><a href="#">foo</a></p>

eller noget helt tredie.

Mens de øvrige <a>-elementer på siden er understreget og blå.

Grunden til at jeg anbefaler ovennævnte metode er, at det giver
minimal strukturel kode ((X)HTML). Man undgår altså at tilplastre
hele siden med class="dit" og class="dat". Derudover er det også
meget nemmere i CSS-koden at se, hvad de enkelte dele gør.



--
Anders Thorsen Holm, BSc i datalogi-multimedier.

Jeg søger fuldtidsjob i Århus - gerne studierelevant, men ingen
betingelse. Læs mit CV: http://www.thorsenholm.dk/cv/

---

Anders Thorsen Holm <usenet@thorsenholm.invalid> writes:

> Jan Hansen <stemmen69@yahoo.dk> wrote:
>
>> a:link {
....
>> a:active {
....
>> a:visited {

> Besøgte links har igen samme farve og er understreget.

>> a {
>> text-decoration: none;
>> }
>
> Her fjernes understregning igen fra samtlige links.

Kun dem der ikke er matchede af ovenstående. Da alle links er matchede
af en af ovenstående regler, så gælder denne regel kun for a-elementer
der *ikke* er links.

> Hvis det kun er
> dine "menu"-links, der skal være uden understregning, skal du bruge
> følgende regel i stedet for ovenstående:
>
> a.menu {
>    text-decoration: none;
> }

Det er nok det der var ment, ja :)



> /* Links og aktive links i menuen er røde. */
> #menu a:link, #menu a:active {
>    color: #f00;
> }
>
> /* Besøgte links i menuen er grønne. */
> #menu a:visited {
>    color: #0f0;
> }

Med den rækkefølge vil aktive visited links også være grønne,
og så kunne man lige så godt droppe "#menu a:active".


/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

---

Lasse Reichstein Nielsen <lrn@hotpop.com> wrote:

> Kun dem der ikke er matchede af ovenstående. Da alle links er
> matchede af en af ovenstående regler, så gælder denne regel kun
> for a-elementer der *ikke* er links.

Beklager, det er mig der roder rundt i det.

>> #menu a:link, #menu a:active {
[snip]
>> #menu a:visited {

> Med den rækkefølge vil aktive visited links også være grønne,
> og så kunne man lige så godt droppe "#menu a:active".

Naturligvis.

Det er vist ved at være sent ... eller også er det varmen ... eller
noget

--
Anders Thorsen Holm, BSc i datalogi-multimedier.

Jeg søger fuldtidsjob i Århus - gerne studierelevant, men ingen
betingelse. Læs mit CV: http://www.thorsenholm.dk/cv/