Y a-t-il quand même (en CSS) pour éviter le soulignement du texte et des liens introduits dans la page ..?
a:hover
doit également être prise en compte, les navigateurs les plus populaires ont tendance à souligner les ancres lors du survol.
Y a-t-il quand même (en CSS) pour éviter le soulignement du texte et des liens introduits dans la page ..?
a:hover
doit également être prise en compte, les navigateurs les plus populaires ont tendance à souligner les ancres lors du survol.
Réponses:
Utilisez CSS. cela supprime les soulignements a
et les u
éléments:
a, u {
text-decoration: none;
}
Parfois, vous devez remplacer d'autres styles pour les éléments, auquel cas vous pouvez utiliser le !important
modificateur sur votre règle:
a {
text-decoration: none !important;
}
color: black !important;
est ajouté pour body
, cela définira-t-il également tous les éléments, y compris les ancres, les ancres visitées, les ancres planées pour être toujours noirs?
text-decoration: none !important;
pour l' body
élément, cela ne fonctionne pour les ancres que lorsque vous définissez explicitement le style text-decoration: inherit;
pour les a
éléments.
!important
et d'utiliser la spécificité et la cardinalité pour remplacer les styles, sinon vous pouvez vous retrouver avec une feuille de style pleine !important
sans aucune compréhension de la structure qui la rend nécessaire. C'est une odeur de code IMO.
!important
c'est comme avoir une bombe nucléaire. Mais une fois que vous démarrez et êtes séduit par l'utilisation d' !important
autres éléments, vous pouvez l'obtenir (nuke) et l'avantage est parti en faveur d'une impasse, ce qui est formidable pour le monde, car la MUD assure la paix, mais dans le monde du CSS, une telle paix signifie que vous ne pouvez pas donner à quelque chose l'avantage.
Cela supprimera votre couleur ainsi que le soulignement avec lequel la balise d'ancrage existe.
a {
text-decoration: none ;
}
a:hover
{
color:white;
text-decoration:none;
cursor:pointer;
}
L'option la plus simple est la suivante:
<a style="text-decoration: none">No underline</a>
Bien sûr, mélanger CSS avec HTML (c'est-à-dire CSS en ligne) n'est pas une bonne idée, surtout lorsque vous utilisez des a
balises partout.
C'est pourquoi c'est une bonne idée d'ajouter ceci à une feuille de style à la place:
a {
text-decoration: none;
}
Ou même ce code dans un fichier JS:
var els = document.getElementsByTagName('a');
for (var el = 0; el < els.length; el++) {
els[el].style["text-decoration"] = "none";
}
Utilisez CSS pour supprimer l' text-decoration
art.
a {
text-decoration: none;
}
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 également 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!
PS- Ceci est ma première réponse!
dans mon cas, il y avait une règle sur l'effet de survol par 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 jusqu'à ce que je le découvre.
Donc: un trait de soulignement ne doit pas être confondu avec un fond de bordure.
Parfois, il sera remplacé par un rendu de l'interface utilisateur CSS. Mieux utiliser:
a.className {
text-decoration: none !important;
}
Pour donner une autre perspective au problème (comme déduit du titre / contenu du message d'origine):
Si vous souhaitez rechercher ce qui crée des soulignements voyous dans votre code HTML, utilisez un outil de débogage. Vous avez l'embarras du choix:
Pour Firefox, il y a FireBug;
Pour Opera, il y a Dragonfly (appelé "Developer Tools" dans le menu Tools-> Advanced; livré avec Opera par défaut);
Pour IE, il y a la "barre d'outils des développeurs Internet Explorer", qui est un téléchargement séparé pour IE7 et inférieur, et est intégrée dans IE8 (appuyez sur F12).
Je n'ai aucune idée de Safari, Chrome et d'autres navigateurs minoritaires, mais vous devriez probablement avoir au moins l'un des trois ci-dessus sur votre machine.
Lorsque vous souhaitez utiliser une balise d'ancrage simplement comme lien sans que le style ajouté (comme le soulignement au survol ou la couleur bleue) s'ajoute class="no-style"
à la balise d'ancrage. Ensuite, dans votre feuille de style globale, créez la classe "sans style".
.no-style {
text-decoration: none !important;
}
Cela présente deux avantages.
N'oubliez pas non plus d'inclure des feuilles de style à l'aide de la balise de lien
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 autre chose que des liens, le soulignement est généralement accepté comme quelque chose qui est cliquable. S'il n'est pas cliquable, ne le soulignez pas.
Les bases CSS peuvent être récupérées dans w3schools
Utilisez la propriété css,
text-decoration:none;
Pour supprimer le soulignement du lien.
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 , la syntaxe suivante doit être utilisée.
<style>
element-name{
text-decoration:none;
}
</style>
Il existe de nombreuses autres valeurs de décoration de texte qui peuvent vous aider à créer des liens.