Css lien pour un titre
bonjour,
J'ai appliqué à tout mes lien dans mon site des valeurs de couleur avec le .a:link; a:visited et a:hover.
Seulement j'aimerai que mon titre qui est aussi un lien soit different de ces valeurs là ( en couleur, font etc...)
j'ai essayé d'appliquer une class=, de le styliser en Css avec !important; mais rien ne fonctionne.
voici mon code html:
et voici mon css:
j'aimerai garder mes valeurs pour tout les autres lien sans rien changer et juste pouvoir changer celui là. je ne suis pas assez bon. pouvez vous m'aider?
J'ai appliqué à tout mes lien dans mon site des valeurs de couleur avec le .a:link; a:visited et a:hover.
Seulement j'aimerai que mon titre qui est aussi un lien soit different de ces valeurs là ( en couleur, font etc...)
j'ai essayé d'appliquer une class=, de le styliser en Css avec !important; mais rien ne fonctionne.
voici mon code html:
<div id="titrelogo" style="margin-left: 41%; position: absolute; top: 25px; z-index: 2;">
<i class="fa fa-plane" aria-hidden="true" style="color: #F5D138; font-size: 28px"></i>
<span style="font-family: 'Montserrat Alternates' sans-serif; font-size: 30px;color: #F5D138 !important;"><a href="http://www.youtube.com/"><b>nouveaudépart</b></a></span>
</div>
et voici mon css:
<!---Logo Titre----->
a.titrelogo{
color: #F5D138 !important;
font-weight: 700;
font-size: 30px;
letter-spacing: -1px;"
text-decoration-line:none;
border-bottom: dashed 3px #F5D138;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
}
a.titrelogo:hover{
text-decoration:none;
color: #7F7F7F;
}
j'aimerai garder mes valeurs pour tout les autres lien sans rien changer et juste pouvoir changer celui là. je ne suis pas assez bon. pouvez vous m'aider?
3 réponses
-
Salut,
Le sélecteur css "a.titrelogo" correspond à "la balise <a> dont la class est titrelogo", or ta balise <a> ne contient pas de classe et titrelogo est l'identifiant du div.
Donc si tu veux conserver ton identifiant, il faut utiliser le sélecteur suivant :#titrelogo a
-> "la balise <a> dans l'élément dont l'identifiant est titrelogo"
Sinon tu peux simplement ajouter une classe à ta balise <a> :<div id="titrelogo" style="margin-left: 41%; position: absolute; top: 25px; z-index: 2;"> <i class="fa fa-plane" aria-hidden="true" style="color: #F5D138; font-size: 28px"></i> <span style="font-family: 'Montserrat Alternates' sans-serif; font-size: 30px;color: #F5D138 !important;"><a href="http://www.youtube.com/" class="logolink"><b>nouveaudépart</b></a></span> </div>
et cibler la balise via cette classe :.logolink
Bonne journée, -
et du coup comment appliquer un hover la dessus?
ceci ne marche pas:#logolink:hover{
text-decoration:none;
color: #7F7F7F !important;-
#logolink -> l'élément dont la l'identifiant est logolink
.logolink -> l'élément dont la classe est logolink
As tu appliqué un id ou une classe sur la balise <a> ? Pour du css, on recommande plutôt d'utiliser des classes :<a href="http://www.youtube.com/" class="logolink"><b>nouveaudépart</b></a>
.logolink { color: red; } .logolink:hover { color: green; } -
..logolink {
font-family: 'Montserrat Alternates' sans-serif;
font-size: 30px;
color: #F5D138 !important;
font-weight: 700;
font-size: 30px;
letter-spacing: -1px;"
text-decoration-line:none;
border-bottom: dashed 3px #F5D138;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
{
.logolink:hover {
text-decoration:none;
color: #999999 !important;
}
j'ai appliqué la class=logolink à ma balise <a> comme tu m'a dit, mais je n'ai toujours pas de :hover. -
-
-
-
-
Alors si je met des !importants après mes valeurs couleurs ça fonctionne.
Si vous avez une meilleure idée je suis preneur.
merci
