[résolu] Lien Dynamique

Bonjour à tous, et oui c'est encore moi. Suite à mon problème de menu verticale, j'ai décider modifier le menu déroulant verticale par une simple liste de lien qui "s'ouvrirait" sur chaque page. En revanche, j'aimerai que chaque lien change de couleur lorsque l'on se place dessus. Je sais qu'il faut que j'utilise un mouseonover mais je débute en HTML,Css et Javascrypte donc je vois pas comment l'intéger. Pour le moment mon code pour mes liens de la page principale :

<div align="left">
  <p><a href="lien1" class="MenuBis">Comment</a>?</p>
  <p><a href="lien2">Par qui?</a></p>
  <p><a href="lien3">Pour qui? </a> </p>
</div>

Modifié par Skelarh (13 Jun 2007 - 18:02)

un petit coup de css suffira

a:hover{
color:#ff00ff;
}

Merki je mettrai mon code tout à l'heure comme ca si certains sont intérressé .

PS : Pas mal la faute, je devais penser à mon futur passage à la Crypte de T4C XD

Bonjour,

N'hésite pas à remplacer tes paragraphe par une liste non-ordonnée ...
Comme ceci par exemple :

<ul>
  <li><a href="lien1" class="MenuBis">Comment</a>?</li>
  <li><a href="lien2">Par qui?</a></li>
  <lip><a href="lien3">Pour qui? </a></li>
</ul>

Au début j'avais une liste, mais je l'ai modifié en <p> pour ne plus avoir les puces de liste.

Skelarh a écrit :
Au début j'avais une liste, mais je l'ai modifié en <p> pour ne plus avoir les puces de liste.

Il suffit simplement d'indiquer dans la feuille css correspondante l'instruction suivante :

ul {
list-style-type: none;
} 

salut !

a écrit :
pour ne plus avoir les puces de liste.

en css li { list-style-type:none; }

++

Mmm, je viens d'essayer mais ca me garde les puces, en gros j'ai la igne de code suivante dans mon fichier index.html

 <ul>
    <li><a href="menu2/lamethode/comment/index.html" class="SousMenuBis"> Comment</a></li>
 </ul>

Et dans mon CSS :

.SousMenuBis {
	font-family: Papyrus;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	background-color: #FFFFCC;
	margin-left: 20px;
	list-style-type: none;
}

Mais pourtant, les puces restent affiché. Ou alors j'ai oublié quelque chose.

Effectivement, tu as oulié quelque chose.
Tu indiques qu'il faut supprimer les puces à la liste de class SousMenuBis, or nulle part dans ton code html, tu ne renseigne la liste comme appartenant à cette class.

Du coup, le lien n'est pas fait, et la règle pas appliquée.
Voilà comment il te faut renseigner la chose :

<ul class="SousMenuBis">
    <li><a href="menu2/lamethode/comment/index.html"> Comment</a></li>
</ul>

Tu n'appliques pas la règle au bon endroit.
D'après ton code, c'est le lien appartient à la classe...
Or, c'est la liste qui propose par défaut des puces.

De plus, il va te falloir séparer les instructions pour la liste et celles pour les liens, comme ceci :

.SousMenuBis {
	background-color: #FFFFCC;
	margin-left: 20px;
	list-style-type: none;
}

.SousMenuBis a {
	font-family: Papyrus;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
} 

Modifié par Cygnus (13 Jun 2007 - 17:51)

Nichel , merci, je comprend mieux. Bon maintenant je vais m'attaquer pour faire un autre style de lien dynamique dans cette liste tout en concervant l'ancien. XD je sens que je vais rouvrir un sujet dans la soiree moi.

Au vu de tes questions et incompréhensions, je ne saurais que trop te conseiller de consulter les articles suivants :
- Bases et indispensables
- Comprendre l'héritage et la parenté des styles CSS
- Et Typographie web : gérer la taille du texte avec les « em »

Bonne lecture

Skelarh a écrit :
XD je sens que je vais rouvrir un sujet dans la soiree moi.

N'hésite pas à indiquer celui-ci comme étant [Résolu] en tout cas ...