Hallo

Welkom, Gast. Alsjeblieft inloggen of registreren.

Recent

206 gasten, 0 leden

Welkom, Gast. Alsjeblieft inloggen of registreren.

28 maart 2024, 21:14:06

Login met gebruikersnaam, wachtwoord en sessielengte

Nieuws

Welkom op het vernieuwde NL Computer Forum!

Auteur Topic: DIV Link kleur  (gelezen 18654 keer)

0 leden en 1 gast bekijken dit topic.

Offline iforczz
  • Net nieuw
  • *
  • Berichten: 1
  • Geslacht: Man
DIV Link kleur
« Gepost op: 22 februari 2014, 16:35:31 »
Hallo allemaal,

ik ben bezig met een website voor school,
en ik ben niet de beste er in,
en nu ben ik bezig met het menu en een soort knop doormiddel van div's en css,
nu heb ik deze css code:
#knop {
 height:25px;
 width:300px;
 float:left;
 margin-top:7px;
 margin-left:7px;
 padding-top:4px;
 padding-left:5px;
 background-color:#CCC;
 border-top-style:solid;
 border-right-style:solid;
 border-bottom-style:solid;
 border-left-style:solid;
 border-top-color:#0;
 border-right-color:#0;
 border-bottom-color:#0;
 border-left-color:#0;
 border-top-width:2px;
 border-right-width:2px;
 border-bottom-width:2px;
 border-left-width:2px;
 text-align:left;
}

En de in de body heb ik dit neergezet
<a style="display:block" href="#index">
  <div id="knop">Home</div>
</a>
ik gebruik dit html type
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

En nu wil ik dus de kleur van de link die op deze div zit een andere kleur geven,
ik heb wel voor elkaar gekregen als ik over de knop hover dat de kleur binnenin anders wordt met behulp van deze code
#knop:hover {
 background-color:#999;
 text-color:#A40000;
}

Maar ik kon dit dus niet werkent zien te krijgen ik heb

#knop:link {geprobeert, dit werkte niet
#knop a:link {En dit werkte ook niet,
kan iemand mij helpen met dit probleem

alvast bedankt.

Offline glompie

  • Net nieuw
  • *
  • Berichten: 5
  • Geslacht: Man
    • Metaaldetector Tips
Re: DIV Link kleur
« Reactie #1 Gepost op: 2 maart 2014, 22:43:55 »
Probeer eerst eens met 


#knop {
 height:25px;
 width:300px;
 float:left;
 margin:7px 0 0 7px;
 padding:4px 0 0 5px;
 background-color:#CCC;
 border:2px solid #000;
 text-align:left;
}


en met


#knop:hover {
 background-color:#999;
 color:#A40000;
}

margin en padding kan je met de klok mee lezen dus : top - right - bottom - left.

#0 is geen kleur.
"text-color" heb ik nooit van gehoord en zal denk ik "color" moeten zijn.
Groetjes,
Bart van de Metaaldetector Tips

Offline glompie

  • Net nieuw
  • *
  • Berichten: 5
  • Geslacht: Man
    • Metaaldetector Tips
Re: DIV Link kleur
« Reactie #2 Gepost op: 2 maart 2014, 23:00:34 »
En om een antwoord op je vraag te geven.

De CSS:
#knop {
 height:25px;
 width:300px;
 float:left;
 margin:7px 0 0 7px;
 padding:4px 0 0 5px;
 background-color:#CCC;
 border:2px solid #000;
 text-align:left;
}
#knop:hover {
 background-color:#999;
}
#knop a:link, #knop a:visited{color:#A40000;text-decoration:none;display:block;}
#knop a:hover{colorrange;text-decoration:underline;}
#knop a:active{color:black;text-decoration:none;}


en de HTML:


<div id="knop"><a href="#index">Home</a></div>
Met de link binnen de div...
En zo kan je de link apart en de knop apart stylen.
Groetjes,
Bart van de Metaaldetector Tips