web-dev-qa-db-fra.com

Comment supprimer la couleur du lien par défaut de la balise HTML 'a'?

La couleur du lien par défaut est le bleu. Comment supprimer la couleur de lien par défaut de la balise de lien hypertexte HTML <a>?

htmlcssanchorhtml-helper
180
Rafiu

Le hérite de la propriété :

a { color: inherit; }

… Fera que l'élément prenne la couleur de son parent (c'est ce que je pense que vous recherchez).

368
Quentin

vous pouvez faire quelque chose comme ça:

a {
    color: #0060B6;
    text-decoration: none;
}

a:hover 
{
     color:#00A0C6; 
     text-decoration:none; 
     cursor:pointer;  
}
43
kleinohad
.cancela,.cancela:link,.cancela:visited,.cancela:hover,.cancela:focus,.cancela:active{
    color: inherit;
    text-decoration: none;
}

J'ai senti qu'il était nécessaire d'afficher la définition de classe ci-dessus. Plusieurs réponses sur SO manquent dans certains états.

17
Kaan Soral

Si vous ne souhaitez pas voir la décoration du texte et la couleur par défaut fournies par le navigateur, vous pouvez conserver le code suivant en haut de votre fichier main.css. Par conséquent, si vous avez besoin de propriétés de style de couleur et de décoration différentes, vous pouvez facilement les remplacer dans la partie inférieure de cet extrait de code dans le fichier de style. 

 a:hover, a:focus, a:active {
      text-decoration: none;
      color: inherit;
 }
8
GURU PRASAD

Ceci est également possible:

        a {
            all: unset;
        }

unset: Ce mot-clé indique de changer toutes les propriétés s'appliquant à l'élément ou le parent de l'élément à leur valeur parent s'ils sont héritable ou à leur valeur initiale sinon. unicode-bidi et les valeurs de direction ne sont pas affectées.

Source: Description de Mozilla

8
gerd hübner

Vous devez utiliser CSS. Voici un exemple de modification de la couleur du lien par défaut, lorsque le lien est assis, lorsqu'il est survolé et qu'il est actif.

a:link {
  color: red;
}

a:hover {
  color: blue;
}

a:active {
  color: green;
}
<a href='http://google.com'>Google</a>

7
Saad Imran.

Vous pouvez utiliser System Color (18.2) values, introduites avec CSS 2.0, mais déconseillé dans CSS 3.

a:link, a:hover, a:active { color: WindowText; }

De cette façon, vos liens d'ancrage auront la même couleur que le texte de document normal sur ce système.

2
knittl

Ajoutez simplement ceci dans CSS,

a {
    color: inherit;
    text-decoration: none;
}

c'est tout, fait.

1
ArifMustafa
a:link{color:inherit;}

c'est la simple ligne peut faire toutes les choses pour vous <3

0
sounish nath

Essaye ça.

a {
  &:visited,
  &:hover,
  &:active,
  &:link {
    color: var(--primary);
  }
}
0
Chawki

Disons que votre couleur par défaut est le vert (# 0F0), alors vous devriez l'ajouter en haut de votre CSS:

a {color:#0F0}

0
MeLight