[CSS] Hyperlinks

Door Herbert Foppen op 28-02-2006 23:31

442 views

Hoi allemaal,
onderstaand een stukje uit mijn CSS-file. Ik krijg het niet voor elkaar om voor de hyperlinks ook een goede style te krijgen.
Wie kan/wil mij helpen?

Herbert
------------------------------------------------

<STYLE type=text/css>
body {
margin: 0px;
padding-top: 0px;
}

html {
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0px;
margin: 0px;
padding-TOP: 0px;
background-color: #E7D9C5;
font-family: Tahoma;
font-size: 12px;
}
}

......

div#menu {
padding-top:10px;
width: 1000px;
height: 35px;
background-image: url(images/menu.jpg);
font-size: 14px;
color: #FFFFFF;
}
...
</STYLE>

Het gaat om de hyperlinks in het menu.
Hier gelijk de tweede vraag. Hoe kan ik hyperlinks in mn "gewone" tekst een andere style meegeven!? CSS:

div#midden {
float: left;
padding: 5px;
width: 597px;
height: 542px;
background-color: #FFFFFF;
text-align: left;
vertical-align: middle;
overflow:auto;
}

Jan Koehoorn

28-02-2006 23:35

In je CSS staan geen codes voor hyperlinks.

Jan Koehoorn

28-02-2006 23:37

Code voor een hyperlink hoort er zo uit te zien:

a:link, a:visited {
/* css styles hier */
}

a:hover, a:active {
/* css styles hier */
}

Onbekende gebruiker

28-02-2006 23:37

Boven in je CSS doe je alle tags dus body, h1, h2 en hyperlinks. We doen dat zo:

a:link {
/* Hier CSS voor nog niet bezochte links in het hele document */
}
a:visited {
/* Hier CSS voor nog bezochte links in het hele document */
}
a:hover {
/* Hier CSS voor nog links waar de muis momenteel opstaat in het hele document */
}
a:active {
/* Hier CSS voor active links in het hele document */
}

De volgorde is van belang. Ezels brugetje. LoVe/HAte

Voor alleen de links in het menu doe je

div#menu a:link, div#menu * a:link

en dan ook met visited, hover en active

Onbekende gebruiker

28-02-2006 23:38

Jan je was me voor :-( Maar ik heb lekker mee :-)

Herbert Foppen

28-02-2006 23:43

Ik wilde het proberen mbv:

a:link {
color: #000066;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000099;
}
a:hover {
text-decoration: none;
color: #CC0000;
}
a:active {
text-decoration: none;
color: #0033CC;
}

maar dan doe ik denk ik iets fout ofzo..

Onbekende gebruiker

28-02-2006 23:49

Als je deze nu na html { ...... } plaatst zou die het moeten doen voor het hele document

Jan Koehoorn

28-02-2006 23:53

In jouw geval is het handiger om het zo te doen:

a {
text-decoration: none;
}

En daarna de andere opmaak.

Herbert Foppen

02-03-2006 23:05

Tnx dudes...
Kheb het nu zo gedaan:

html { ... }

a {text-decoration: none;}

a:link {color: #000099;}
a:visited {color: #000099;}
a:hover {color: #000099;}
a:active {color: #000099;}

Pieter van Linschoten

02-03-2006 23:18

Waarom heb je bij die bovenste post 2 keer } achter elkaar?

html {
padding-right: 0px;
etc....
}
}

?!

Willem Jan Z

03-03-2006 02:14

Waarschijnlijk gewoon een foutje..

Reageren

Inloggen om te reageren