web-dev-qa-db-fra.com

Comment supprimer le soulignement pour les ancres (liens)?

Est-il possible (en CSS) d'éviter le soulignement du texte et des liens introduits dans la page ..?

htmlcssunderline
260
Steven

Utilisez CSS. ceci supprime les soulignés des éléments a et u:

a, u {
    text-decoration: none;
}

Parfois, vous devez remplacer d'autres styles d'éléments, auquel cas vous pouvez utiliser le modificateur !important sur votre règle:

a {
    text-decoration: none !important;
}
441
Emil Vikström

Le css est 

text-decoration: none;

et

text-decoration: underline;
25
DanDan

Cela supprimera votre couleur et soulignera que la balise d'ancrage existe avec 

 a {
     text-decoration: none ;
  }
a:hover
  {
    color:white;
    text-decoration:none;
    cursor:pointer;
   }
15
Ashwin Shahi

Meilleure option:

<a name="#" style="text-decoration:none" >2000001</a>

<a style="text-decoration:none" name="#">2000001</a>

Testé sur IPHONE, Androidbrowser/email - fonctionne comme un charme.

8
XLogic

Utilisez CSS pour supprimer text-decorations.

a {
    text-decoration: none;
}
6
Alan Haggai Alavi

Meilleure option pour vous si vous souhaitez simplement supprimer le soulignement du lien d'ancrage uniquement - 

    #content a{
                text-decoration-line:none;
                }

Cela supprimera le soulignement. 

De plus, vous pouvez utiliser une syntaxe similaire pour manipuler d’autres styles en utilisant-

                text-decoration: none;
                text-decoration-color: blue;
                text-decoration-skip: spaces;
                text-decoration-style: dotted;

J'espère que cela t'aides!

P.S.- Ceci est ma première réponse!

4
praveen kaushik

Parfois, il sera remplacé par certains rendus CSS UI. Mieux vaut utiliser:

a.className {
    text-decoration: none !important;
}
4
Sanjib Karmakar

dans mon cas, il y avait une règle sur l'effet de survol de l'ancre, comme ceci:

#content a:hover{
border-bottom: 1px solid #333;
}

Bien sûr, text-decoration:none; ne pouvait pas aider dans cette situation ..__ Et je passe beaucoup de temps à le découvrir.

Alors: Un trait de soulignement ne doit pas être confondu avec un fond de bordure.

3
Aleksandr Khomenko

Pour donner une autre perspective au problème (comme l'indiquent le titre/le contenu du message d'origine):

Si vous souhaitez localiser ce qui crée des soulignements non autorisés dans votre code HTML, utilisez un outil de débogage. Il y a beaucoup de choix:

Pour Firefox, il y a FireBug;

Pour Opera, il y a Dragonfly (appelé "Outils de développement" dans le menu Outils-> Avancé; livré avec Opera par défaut);

Pour IE, il existe la "barre d'outils de développement Internet Explorer", téléchargeable séparément pour IE7 et les versions antérieures, intégrée à IE8 (élément F12).

Je n'ai aucune idée de Safari, de Chrome et d'autres navigateurs minoritaires, mais vous devriez quand même avoir au moins l'un des trois précédents sur votre ordinateur.

1
Vilx-

Lorsque vous souhaitez utiliser une balise d'ancrage simplement comme lien sans le style ajouté (comme le soulignement sur le survol ou la couleur bleue), ajoutez class="no-style" à la balise d'ancrage. Ensuite, dans votre feuille de style globale, créez la classe "no-style".

.no-style { text-decoration: none !important; }

Cela a deux avantages.

  1. Cela n'affectera pas toutes les balises d'ancrage, mais uniquement celles auxquelles la classe "no-style" a été ajoutée.
  2. Il remplacera tout autre style susceptible d'empêcher la définition de la décoration du texte sur aucun.
1
Frederick John

N'oubliez pas non plus d'inclure des feuilles de style à l'aide de la balise link

http://www.w3schools.com/TAGS/tag_link.asp

Ou insérez CSS dans une balise de style sur votre page Web.

<style>
  a { text-decoration:none; }
  p { text-decoration:underline; }
</style>

Je ne recommanderais pas d'utiliser le soulignement sur quoi que ce soit en dehors des liens, soulignement est généralement accepté comme quelque chose de cliquable. Si ce n'est pas cliquable, ne le soulignez pas.

Les bases de CSS peuvent être récupérées à w3schools

0
JasonS

Le soulignement peut être supprimé par une propriété CSS appelée décoration de texte.

<style>
a{
text-decoration:none;
}
</style>

Si vous souhaitez supprimer le soulignement du texte présent dans les éléments autres que a, utilisez la syntaxe suivante.

<style>
element-name{
text-decoration:none;
}
</style>

Il existe de nombreuses autres valeurs text-decoration qui peuvent vous aider à concevoir des liens.

0
Sheraz
<u>

est une balise déconseillée.

Utilisation...

<span class="underline">My text</span>

avec un fichier CSS contenant ...

span.underline
{
    text-decoration: underline;
}

ou juste...

<span style="text-decoration:underline">My Text</span>
0
Moose Factory

Utiliser la propriété css,

text-decoration:none;

Pour supprimer le soulignement du lien.

0
Smita Kagwade