Pourquoi est-lien de souligner apparaissant après avoir cliqué sur le lien?

J'ai une balise d'ancrage de style avec
text-decoration: none.

Cela a supprimé le souligner de mes liens, qui est ce que je veux.

Cependant, après un clic sur le lien, un peu de le lien souligner apparaissent sous les espaces entre les icônes dans le lien.

J'ai quelque chose comme ce

<a ng-click="toggle(this)" style="text-decoration: none">
  <i class="fa fa-caret-down"  ng-if="!collapsed"></i>
  <i class="fa fa-folder-open-o" ng-if="!collapsed"></i>
  <i class="fa fa-caret-right"  ng-if="collapsed"></i>
  <i class="fa fa-folder-o" ng-if="collapsed"></i>
</a>

(À l'aide de la police impressionnant icônes)

Le soulignement apparaît juste sous le vide de l'espace entre les icônes.

Est-il un moyen de se débarrasser de ce lien souligner pour une fois et pour toujours?!

ne laisser aucun espace; essayez d'avoir une ouverture d' <a>, et remplissez les lignes sans espaces. <i class></i><i class></i> etcc.. voir qui aide.
C'est text-decoration pas text-decoration-line. text-decoration-line existe, mais est pris en charge uniquement par les FF.
J'ai modifié la question d'utiliser text-decoration, parce qu'elle présente le même comportement

InformationsquelleAutor Victor Grazi | 2015-01-16

67

C'est parce que la CSS par défaut des valeurs pour les liens sont déclarés par les différents navigateurs. Un lien a 4 états officiels.
- Normal
- Passez
- Active (Sur clic de souris)
- Visité
- (Focus)
En CSS, vous pouvez déclarer le style pour chacun de ces. Si vous voulez le lien pour ne pas afficher le texte dans la décoration de ces états:
```
a, a:hover, a:active, a:visited, a:focus {
    text-decoration:none;
}
```
Réponse à votre commentaire

Oui, vous pouvez remplacer l'un avec un nom de classe. Par exemple, vous avez un lien avec la classe "myLink'.

Vous pouvez faire le CSS:
```
.myLink, .myLink:hover, .myLink:active, .myLink:visited, .myLink:focus {
    text-decoration:none;
}
```
- Est-il possible que je peux le faire avec une classe, donc il n'a pas d'effet sur l'ensemble de mes liens?
- Oui, vous pouvez. J'ai mis à jour ma réponse avec un exemple.
- J'ai dû faire ajouter: "a:focus { text-decoration:none; }" dans le CSS.
- Bon Dieu! J'ai cru Mozilla Firefox est le navigateur le plus avancé sur la planète, mais juste a, a:hover ne marcherait pas! Je n'ai pas pris la peine de vérifier si c'était :focus ou :active qu'il fixe pour moi, j'ai inclus à la fois comme une (supposée) de la croix-navigateur fixer.
- Ohh! et par la manière, a {text-decoration:none !important;} fonctionne bien aussi mais je voulais éviter. Je ne veux pas de bagarre par le biais de mon CSS après quelques mois à essayer de comprendre ce qui est arrivé à mon ancrage des balises.
InformationsquelleAutor Mark Nijboer
10

Le droit chemin et vous devez couvrir ce en ajoutant le code css suivant dans votre feuille de style définition:
```
**Longer CSS Styling definition:** 

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    text-decoration: none;
}

**Shorter CSS definition:**

a, a:visited, a:hover, a:active {
    text-decoration:none;
}
```
cela permettra de s'assurer qu'aucun soulignant tout état de liens pour être absolument sûr qu'il n'y aura pas de soulignement dans l'un des liens sur la page. Vous pouvez également condenser le style de la définition dans votre css de sorte que le code n'est pas trop longue et il est plus efficace de contrôler de style pour tous les lien comportements car il s'applique à tous les liens sur la page lorsque vous êtes à la définition de un

si vous voulez le style pour les liens spécifiques que vous feriez suivantes:
```
a.nav:link    {text-decoration: none; }
a.nav:visited {text-decoration: none; }
a.nav:hover   {text-decoration: none; }
a.nav:active  {text-decoration: none; }

<a href="/" class="nav">styled links</a>.
```
ou quelque chose de complètement différent de l'ajout de couleurs, de surligner, de la police de poids, de taille, qui vont être différents dans chaque état de lien spécifique à chaque classe.
```
a.external:link    {color: #0000ff; font-size: 18pt; font-weight: bold; }
a.external:visited {color: #894f7b; font-weight: bold; }
a.external:hover   {text-decoration: overline; background-color: #003399; }
a.external:active  {color: red; }
```
- Je n'étais pas au courant de la une:sélection de lien et il me mordre lors de l'utilisation de réagir-routeur et leur Lien composant ne pouvait pas se débarrasser de ce méchant souligner. Merci.
InformationsquelleAutor unixmiah
6

Vous utilisez la mauvaise propriété... text-decoration-line n'est pas fait pour ça.

Le texte-la décoration de la ligne de propriété spécifie le type de ligne, le cas échéant, la décoration ont

Utilisation text-decoration: none au lieu

InformationsquelleAutor LcSalazar
3
```
<style>
   a{text-decoration:none}
   a:visited{text-decoration:none}
</style>
```
Ajouter une feuille de style à votre projet
- Quand je le préciser dans une feuille de style, il ne fonctionne pas. Cependant, si je inline à droite dans la balise d'ancrage style="text-decoration: none" qui fonctionne. Est-il possible d'obtenir ce à l'honneur de la feuille de style?
- c'est étrange, et il ne devrait pas arriver. vous avez la feuille de style dans le mauvais endroit ou trop répétés <un lien de définition de style existante dans votre définition du style ou quelque chose peut-être qui se chevauchent votre style de tous ensemble. Dans un document html lorsque vous spécifiez un css entre <head> il doit couvrir tous les liens dans le document html.
- Non, j'ai beaucoup d'autres styles dans la feuille de style. Il semble que j'ai besoin de la pseudo classe hover
InformationsquelleAutor Alexis Peters

Vous devez vous connecter pour publier un commentaire.