rss
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Résolu

Souligné au survol d’un hyperlien

faureste, le lundi 1 octobre 2007 à 11:07:06
Bonjour à tous voici mon problème.
Je suis en train de créer un site sous Dreamweaver et j’ai effectué un menu à gauche de celui-ci. Mais le problème c’est qu’il y a énormément d’hyperliens dans les sous menus ce qui nuie à la lisibilité du site (trop de surlignage et donne un effet illisible).Donc je voudrais savoir si il existe un script pour retirer le souligné sous les liens hypertextes et de le faire apparaître seulement au survol de la souris. Je précise que mon site est en HTML

Merci a tous pour votre aide
Configuration: Windows XP
Internet Explorer 7.0
Répondre à faureste  Signaler ce message aux modérateurs Aller au dernier message

1


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Tonysurf55, le lundi 1 octobre 2007 à 11:20:42
Bonjour,

faut que tu utilise les feuilles de style, c'est des fichiers.css
renseigne toi sur les css, c'est tres facil
   
Répondre à Tonysurf55

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
anon, le lundi 1 octobre 2007 à 11:26:58
Bonjour,

Premièrement il est important de savoir que les liens hypertextes sont soulignés pour permettre au lecteur de les répérer immédiatement au milieu d'une page. c'est donc généralement une très mauvaise pratique de ne pas afficher le soulignement, ou de ne l'afficher qu'au survol.

Après cet avertissement de rigueur, je précise que dans le cas de menus, il est implicite et évident (opur quiconque à déjà navigué sur le web) qu'il s'agit là de liens.

nul besoin d'un script pour obtenir le résultat que vous cherchez, cela se passe au niveau de la feuille de style (CSS), il s'agit de définir un style pour les liens de votre menu.

par exemple, imaginons que le style à appliquer aux liens de votre menus soit la classe "menugauche", pour obtenir l'effet que vous souhaiter, dans la feuille de style il suffit d'ajouter:

a.menugauche:link {text-decoration:none} /* lien non visité */
a.menugauche:visited {text-decoration:none} /* lien visité */
a.menugauche:hover {text-decoration:underline} /* lien survolé */
a.menugauche:active {text-decoration:none} /* lien sélectionné */

pour en savoir plus sur les CSS:

cssintro
http://css.alsacreations.com/
http://openweb.eu.org/css/
http://mammouthland.free.fr/cours/css/
http://www.w3schools.com/css/
   
Répondre à anon

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
stanboost, le lundi 1 octobre 2007 à 11:35:44
Bonjour,
Tu n'as pas besoin de faire du CSS juste pour des liens tu fais comme ci-dessous.

il te suffit d'inserer ces lignes entre les balises <HEAD> et </HEAD> :

<style type="text/css">
<!--
A { color:#000000; text-decoration:none; }
A:hover { color:#FF0000;text-decoration:underline;}
-->
</style>

color:#000000; : ceci definit la couleur de tous les liens de la page. Ici, ils seront noirs.
text-decoration:none; : ici, on indique que les liens ne seront pas soulignés.
color:#FF0000; : ceci indique que les liens passeront au rouge au passage de la souris.
text-decoration:underline; : ici, on indique qu'ils se souligneront.

(La totalité des liens sur la page seront du type ci-dessus)




Pour le CCS:

- Explications

A : designe la classe du lien. Dans cet exemple c'est la classe par défaut (<a></a>).
link : Il designe les liens qui n'ont pas encore été visités.
active : Cet attribut désigne le lien lorsqu'il est cliqué.
visited : Celui-ci désigne les liens précédemment visités.
hover : Le hover designe les liens lorsqu'il sont survolés.

Il te suffit de faire une feuille de style (.CSS)
une recherche GOOGLE: Tutorial feuille de style


Bonne recherche :) S'il n'y a pas de solution c'est qu'il n'y a pas de problème...
   
Répondre à stanboost

4


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
stanboost, le lundi 1 octobre 2007 à 11:38:41
PS/
Dans ton cas l'utilisation d'une feuille de style ferait que tu devrais modifier la totalité de ton site
pour le passage en CSS pas compliqué mais c'est du temps à faire tous les changements.

D'ou ma solution n°1 ;) S'il n'y a pas de solution c'est qu'il n'y a pas de problème­...
   
Répondre à stanboost

5


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
faureste, le lundi 1 octobre 2007 à 11:58:04
Merci à tous,

il est vrai que de changer autant de pages (environ 120 pages mini) à la main c'est trés long, mais je crois également que d'apprendre le CSS neccessite encore + de temps. Entre le PHP, le CCS, HTML on voit des codes partout (on devient vite allergique) mais si il faut en passer par la pour que les internautes si retrouvent au niveau naviguation... Bref, ça risque d'etre un apprentissage long et fastidieux
   
Répondre à faureste

6


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
anon, le lundi 1 octobre 2007 à 12:21:31
Bonjour,

la solution de stanboost implique de modifier *tous* tes fichiers contenant le menu à chaque fois que tu souhaites modifier ton menu, utiliser un fichier externe permet de modifier un seul fichier pour la totalité du site par la suite.

rassure toi, apprendre à se servir des css se fait en l'espace d'un weekend, il n'y a que dans les cas avancés et dans les bugs d'affichages des anciennes versions d'IE que ça peut être prise de tête.

pour ne pas avoir à modifier toutes les pages à chaque fois que tu modifies ton menu, il te suffit de place le code correspondant à ton menu dans un fichier externe à la page et d'l'inclure dans la page avec une ligne de code php.

si tu souhaites modifier chacun des liens de ton menu un par un, tu peux utiliser la déclaration de css en ligne (pas recommandé car cela complique la maintenance et retire beaucoup de son intérêt au CSS).

voila 2 exemple de comment ça se passe avec le code à gauche et le résultat à droite, celui qui correspond à ce que tu demande est le dernier du 2eme exemple.
http://www.w3schools.com/css/tryit.asp?filename=trycss_link
http://www.w3schools.com/css/tryit.asp?filename=trycss_link2­

@stanboost: gare à la confusion, ce que tu présentes comme n'etant pas du CSS, est en fait une déclaration interne de CSS.
les déclarations de CSS sont de 3 types: externe, interne et en ligne. mais ça reste du CSS. voir: http://www.w3schools.com/css/css_howto.asp
et le code que tu donne en exemple posera problème car il redéfinit le style de toutes les balises a et pas seulement celle du menu.
   
Répondre à anon

7


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
stanboost, le lundi 1 octobre 2007 à 18:47:52
Bonsoir faureste

Le CSS n'est pas le langage le plus compliqué et il y a des tutoriaux vraiment partout,
par contre de là à apprendre en un week end... perso j'ai pas eu de mal avec HTML et PHP mais le CSS
j'ai vraiment pas accroché... pour dire, je passe par un générateur pour mes feuilles de styles :)


---------------------------------

Bonsoir anon

tu dis ..implique de modifier *tous* tes fichiers contenant le menu à chaque fois...
mais pour une feuille de style c'est la même chose il doit changer la totalité des pages...

En effet tu as raison, pour le CSS, après comme je dis plus haut le code change la totalité des liens ;)

Bonne soirée à tous
S'il n'y a pas de solution c'est qu'il n'y a pas de problème­...
   
Répondre à stanboost

8


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
anon, le lundi 1 octobre 2007 à 19:45:48
Je n'y ai pas pensé tout à lheure, mais il y a des exemples de menus en css de toutes sortes qui sont disponible sur http://www.cssplay.co.uk/menus/

@stanboost:je vais supposer que tu es de bonne foi et que tu n'as pas bien lu ce que j'ai écrit ou que je ne me suis pas exprimé de manière suffisament claire.

je me cite et souligne la différence entre une déclaration CSS interne et externe:

la solution de stanboost implique de modifier *tous* tes fichiers contenant le menu à chaque fois que tu souhaites modifier ton menu, utiliser un fichier externe permet de modifier un seul fichier pour la totalité du site par la suite.

dans tous les cas de figure, la modification initiale de tous les fichiers est requise, la différence entre les deux approches se fait après cette modification initiale: dans le cas d'une déclaration interne, toute modification ulterieure du style (changer la couleur desliens du menu par exemple) implique de modifier à chaque fois tous les fichiers tandis que dans le cas d'une déclaration externe les modification ulterieure se font toutes au sein d'un seul et unique fichier.

Le principal intérêt des feuilles de style est là: pouvoir le style de la totalité d'un site à partir d'un seul et unique fichier.

de même j'ai bien apprendre à servir des CSS se fait en l'espace d'un weekend et non pas connaitre/maitriser CSS, par là je voulais dire qu'il ne faut pas longtemps pour comprendre comment ça fonctionne et commencer à s'en servir pour des choses simples comme retirer le trait de soulignement sous certains liens d'une page et pas des autres. Et en disant ça j'ai compté large, pour moi (qui possède certaine facilités dans le domaine technique) la prise en main des CSS ne m'a pris qu'une grosse demie-heure.
   
Répondre à anon

9


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
faureste, le lundi 1 octobre 2007 à 20:26:48
Merci pour toutes ces remarques...

Je pense que si l'on veut faire un site propre et bien construit le CSS devient incontournable, mais moi j'ai plus tendance à soigner le design de mon site, et le problème c que l'on peut faire un site superbe mais sans une ergonomie... c pas le top. (Le visiteur perdra de l'attention et ne reviendra plus) En attendant j'arrive un peu à bricoler le code HTML et maintenant se sera également les feuilles de style CSS.
On n’a rien sans rien.
En même temps je veux réellement réussir se premier site et je viendrais souvent sur le forum vous embêtez avec mes questions bêtes ;)

Pour ce qui est du PHP ça attendra un peu... :/ et pourtant ça me serait bien utile (formulaire, news letter, module de recherche interne)

merci encore et @ bientot :)
   
Répondre à faureste

10


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
stanboost, le lundi 1 octobre 2007 à 23:15:55
@ anon

autant pour moi il est vrai que j'ai lu ton post "à la rapide" :)
le resultat est le même il doit modifier toutes les pages de toute façon!
et dans les deux cas il doit changer toutes les pages on est d'accord!
merci de l'éclairssisement et des liens intéressant.
Pour la prise en main du CSS bein je dois être plus bête qu'un autre alors
parce que moi c'etait pas simple à mon goût, enfin chacun sont rythme et ses préférences :)

--------------------------------


@ faureste

Comme tu dis, on n’a rien sans rien.
C'est vrai qu'une feuille de style c'est vraiment top, j'ai du mal encore avec le CSS
surtout niveau compatibilité IE, SAFARI et Firefox j'avais moins de mal à l'époque,
mais mon code etait pas très propre non plus ^^
Et je te comprend pour le PHP c'est plus interessant donc peut être plus facile
à apprendre c'est mon cas... je delaisse un peu le CSS pour le PHP a vrai dire :)

Bon courage pour la suite ;)
S'il n'y a pas de solution c'est qu'il n'y a pas de problème...
   
Répondre à stanboost

11


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
lavigne_prog, le vendredi 7 mars 2008 à 11:46:39
bjr ,
presk le mm probleme moi je ve ke mes liens changent de couleurs une fois ke le curseur se positionne sur mon lien .
g deja fé une feuille de style pour anuler le soulignement la voila
.links {font-family: Tahoma;
font-size: 10px;
font-weight: bold;
color: #0D85B3;
text-decoration: none;
border: none;

}

et je sais pa ou ajouter ce hover pour ke mes liens changent de couleurs sv aidez moi g essayé ca
A.links:hover{
color="red"}
mais ca na pa marché merci jen serais reconnaissante.
   
Répondre à lavigne_prog

12


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
lavigne_progr, le vendredi 7 mars 2008 à 12:56:47
tjrs pade reponse??:ss:s::s
   
Répondre à lavigne_progr

13


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 Jide, le mardi 18 mars 2008 à 11:45:51
En css tu ne met pas de "=" mais des ":"
Ton css ne doit donc pas etre
A.links:hover{
color="red"}

mais

A.links:hover{
color:"red";}

PS: n'oublie pas le ";" à la fin de chaque ligne. Je crois que ce n'est pas obligatoire pour le dernier mais c'est plus propre
   
Répondre à Jide
Posez votre question Répondre
Soulignement pendant le survol du lien (Résolu)Bonjour a tous, Mon problème est la suivante : je ne parvient pas a afficher le soulignement de tous mes liens pendant le survol de la souri sur ces derniers. J’utilise dreamweaver CS3 pour la conception de mes pages web, dans la propriété de ma pages... www.commentcamarche.net/forum/affich-5269126-soulignement-pendant-le-survol-du-lien
[Powerpoint] Exporter un PPT en PDF avec les hyperliensVoici comment exporter un PPT en PDF tout en conservant les hyperliens cliquables. 1 Lancez OpenOffice Impress 2 Ouvrez votre fichier .PPT ou .PPS 3 Allez dans le menu Fichier > Exporter au format PDF... C'est tout ! www.commentcamarche.net/faq/sujet-4436-powerpoint-exporter-un-ppt-en-pdf-avec-les-hyperliens
HTML: Lien hypertexte (sans soulignement) (Résolu)Bonjour, je construit un site web avec Dreamweaver Mx2004 et lorsque je fais un lien hypertexte j'ai le soulignement commme d'habitude.J'aimerais savoir comment enlever le soulignemnt tout en gardant le liens en activité (je peux... www.commentcamarche.net/forum/affich-1891864-html-lien-hypertexte-sans-soulignement
Skyblog - Les liensUn simple lien Pour créer un simple lien dans un SkyBlog, la syntaxe à utiliser est la suivante : [a=adresse du lien] le nom choisi pour ce lien [ /a] [a=http ://www.commentcamarche.net] CCM [ /a] Un lien non souligné Pour avoir un lien non... www.commentcamarche.net/faq/sujet-5783-skyblog-les-liens
Convertir un fichier PPS en PDFVoici comment exporter un fichier PPS ou PPT (fichier PowerPoint) en PDF tout en conservant les hyperliens cliquables. 1 Télécharger OpenOffice Télécharger et exécuter OpenOffice Impress 2 Ouvrir le fichier Ouvrir le fichier .PPT ou .PPS 3... www.commentcamarche.net/faq/sujet-5636-convertir-un-fichier-pps-en-pdf
Dictionnaire Myspell - Supprimer un mot ajouté par erreurLe dictionnaire Myspell permet à des logiciels comme Firefox et Thunderbird d'intégrer un correcteur orthographique lors de la rédaction de messages. Lorsqu'un mot est mal orthographié, il est souligné par des pointillés rouges et un clic droit... www.commentcamarche.net/faq/sujet-11297-dictionnaire-myspell-supprimer-un-mot-ajoute-par-erreur
Comment créer un lien non souligné (Résolu)salut, je voudrais savoir quel est le code html à utiliser pour créer un lien non souligné et que si, ce code est compatible avec Explorer www.commentcamarche.net/forum/affich-859674-comment-creer-un-lien-non-souligne
Configuration des liens (couleur, survol, ... (Résolu)Bonjour à tous, J’ai un souci de configuration de liens avec le logiciel Dreamweaver . En effet, celui-ci me propose de configurer pour l’ensemble de la page la couleur des liens, le survol, … Cependant, je souhaite obtenir deux configurations... www.commentcamarche.net/forum/affich-2473843-configuration-des-liens-couleur-survol
Ajout texte au survol d'une image (Résolu)Bonjour a tous, Sous XP, je souhaite , en survol ,lorsque la souris passe sur un personnage d'une photo que le nom de celui-ci apparaisse. Qui peut me donner la solution ? D'avance MERCI www.commentcamarche.net/forum/affich-3201672-ajout-texte-au-survol-d-une-image
Télécharger Capteur de CouleursCapteur de Couleurs est une application de capture de couleur. Il est rapied et facile à utiliser. Il permet de déterminer les codes Hexa, WEB et RGB des pixels survollés par la souris. Les informations concernants la couleur sont ensuite copiées dans... www.commentcamarche.net/telecharger/telecharger-34056642-capteur-de-couleurs
IGN GEORANDO PROVENCEIGN GEORANDO PROVENCE,,Préparation de randonnées / Vues aériennes (1:25000), survol 3D / Compatibilité GPS, exportation vers PDA / Langues : Français et Anglais. Disponibilité: Expédié sous 24h www.commentcamarche.net/guide-achat/ign-georando-provence-451682809-fiche-technique
IGN GEORANDO AIN-HAUTE SAVOIEIGN GEORANDO AIN-HAUTE SAVOIE,,Préparation de randonnées / Vues aériennes (1:25000), survol 3D / Compatibilité GPS, exportation vers PDA / Langues : Français et Anglais. Disponibilité: Expédié sous 24h www.commentcamarche.net/guide-achat/ign-georando-ain-haute-savoie-451682739-fiche-technique
IGN GEORANDO CHER-INDREIGN GEORANDO CHER-INDRE,,Préparation de randonnées / Vues aériennes (1:25000), survol 3D / Compatibilité GPS, exportation vers PDA / Langues : Français et Anglais. Disponibilité: Expédié sous 24h www.commentcamarche.net/guide-achat/ign-georando-cher-indre-451682750-fiche-technique
Des images satellites des pays survolés par les avions Air France durant les vols(Paris - Relaxnews) - Grâce à des images fournies par l'Agence spatiale européenne (ESA), les passagers à bord de certains avions Air France vont pouvoir admirer des images satellites des pays survolés durant leur vol d'ici la fin de l'année.Sur leurs... www.commentcamarche.net/actualites/des-images-satellites-des-pays-survoles-par-les-avions-air-france-durant-les-vols-3542911-actualite.php3
HTML - Liens hypertextes Les liens hypertextes (ancrages) sont des éléments d'une page HTML (soulignés lorsqu'il s'agit de texte) permettant aux internautes de naviguer vers une nouvelle adresse lorsque l'on clique dessus. Ce sont les liens hypertextes qui permettent de lier... www.commentcamarche.net/html/htmlhypertxt.php3
L'assembleur - Fichier source et compilation Le programme doit être saisi dans un fichier texte non formaté (c'est-à-dire sans caractères en gras, souligné, avec des polices de caractères de différentes tailles, ...) appelé fichier source. En effet, l'assembleur (le programme permettant de... www.commentcamarche.net/asm/source.php3
Toutes les réponses pour « Souligné au survol d’un hyperlien »