Nenex Posté 18 Septembre 2009 Partager Posté 18 Septembre 2009 (modifié) Slt Pouvez vous eclairer ma lanterne Pour le site d'une copine je vais lui faire un menu simple en image survolees en CSS. Voila le CSS pour un bouton : .bouton-mes-produits { background:url(../elements-des-pages/acceuil/bouton.png); width:200px; height:33px; display:block; position:absolute; background-repeat:no-repeat; /* Position block */ top:150px; left:10px; /* dimentions */ left:100px; top:200px; /* Texte */ font-family:normal; font-size:1em; font-weight:bold; color:#FFFF00; text-align:center;}.bouton-mes-produits:hover { background:url(../elements-des-pages/acceuil/bouton.png); width:200px; height:33px; cursor:pointer; text-decoration:none; color:#00FFFF;} Certaine propriete seront les meme pour les autres boutons. Par exemple, la dimention du block, centrage du texte, etc. Pour les proprietes qui seront les meme pour touts les bouton, est-il possible de faire comme ca : bouton-mes-produits, bouton-me-trouver, bouton-contact { width:200px; height:33px; font-family:normal; font-size:1em; font-weight:bold; color:#FFFF00; text-align:center;}bouton-mes-produits:hover, bouton-me-trouver:hover, bouton-contact:hover { color:#00FFFF;} Comme ca si je doit modifier, par exemple la couleur du hover, je ne fait qu'une seule modif. Pareil pour le texte. Merci pour vos lumieres Modifié 18 Septembre 2009 par Nenex Lien vers le commentaire Partager sur d’autres sites More sharing options...
jcaron Posté 19 Septembre 2009 Partager Posté 19 Septembre 2009 Je pense que tu devrais relire quelques trucs sur la différence entre "class" et "id". "Class" (donc la notation .nomdeclasse ou type.nomdeclasse en CSS) peut être appliqué à plusieurs objets qui partagent les mêmes attributes. "Id" (donc la notation #id ou type#id en CSS) est prévu pour être associé à un seul objet. Ce qui fait qu'en général, tu vas avoir quelque chose comme ça: <div class="classe1" id="div1">....</div><div class="classe1" id="div2">...</div> Et en CSS: div.classe1{/* attributs communs à tous les div avec la classe "classe1" */}div#div1{/* attributs spécifiques au div id=div1 */}div#div2{/* attributs spécifiques au div id=div2 */} etc. Tu peux même mettre plusieurs classes sur un objet si nécessaire (en les séparant par des espaces dans l'attribut class). Jacques. Lien vers le commentaire Partager sur d’autres sites More sharing options...
petit-ourson Posté 19 Septembre 2009 Partager Posté 19 Septembre 2009 Oui c'est possible, mais il faut écrire : .bouton-mes-produits, .bouton-me-trouver, .bouton-contact {...}.bouton-mes-produits:hover, .bouton-me-trouver:hover, .bouton-contact:hover {...} Lien vers le commentaire Partager sur d’autres sites More sharing options...
Nenex Posté 19 Septembre 2009 Auteur Partager Posté 19 Septembre 2009 Je pense que tu devrais relire quelques trucs sur la différence entre "class" et "id". "Class" (donc la notation .nomdeclasse ou type.nomdeclasse en CSS) peut être appliqué à plusieurs objets qui partagent les mêmes attributes. "Id" (donc la notation #id ou type#id en CSS) est prévu pour être associé à un seul objet. Ce qui fait qu'en général, tu vas avoir quelque chose comme ça: <div class="classe1" id="div1">....</div><div class="classe1" id="div2">...</div> Et en CSS: div.classe1{/* attributs communs à tous les div avec la classe "classe1" */}div#div1{/* attributs spécifiques au div id=div1 */}div#div2{/* attributs spécifiques au div id=div2 */} etc. Tu peux même mettre plusieurs classes sur un objet si nécessaire (en les séparant par des espaces dans l'attribut class). Jacques. Je connais la difference entre id et class. Je demande pas si je peu mettre pluseiurs class. Regarde mieux les 2eme codes tu vera que c'est pas ca. Je me suis peut etre mal exprime. Oui c'est possible, mais il faut écrire : .bouton-mes-produits, .bouton-me-trouver, .bouton-contact {...}.bouton-mes-produits:hover, .bouton-me-trouver:hover, .bouton-contact:hover {...} ha oui j'ai oublie les point avant les nom des class. Merci. Lien vers le commentaire Partager sur d’autres sites More sharing options...
jcaron Posté 19 Septembre 2009 Partager Posté 19 Septembre 2009 Pas la peine de citer l'intrégalité des messages qui sont juste avant. Pour ma part, je voulais simplement dire que si tu as plusieurs objets qui ont des propriétés CSS communes, plutôt que de faire une liste des objets en question dans ton CSS, c'est plus simple d'utiliser une classe unique. Comme ça, si tu rajoutes un autre objet du même genre, tu n'as que ta page HTML à modifier, pas ton CSS (ou uniquement pour les propriétés spécifiques à ce nouveau bouton). Ca fait du code nettement plus facile à maintenir. Donc au lieu de faire .bouton-ceci, .bouton-cela, .bouton-autre-chose dans ton CSS (et la liste s'allonge à chaque fois que tu ajoutes un bouton), tu les mets tous dans la même classe "bouton", et tu utilises .bouton dans ton css. Pour les propriétés qui sont différentes d'un bouton à l'autre, tu utilises soit un ID (ce qui serait le plus logique), soit une autre classe. Mais ce n'est évidemment que mon avis, et je le partage :-) Jacques. Lien vers le commentaire Partager sur d’autres sites More sharing options...
Nenex Posté 19 Septembre 2009 Auteur Partager Posté 19 Septembre 2009 La liste ne s'allongera pas pour les bouton (bon allez peut etre 1, voir 2, mais pas plus). Je sais qu'il faut essayer de voir plus loin (au cas ou..), mais la j'en suis certain. Et si je doit rajouter un bouton, j'ai juste le nom de sa classe a rajouter dans dans la fameuse liste du fichier CSS . Pas epuisant quand meme Pour l'id oui tu a raison. Ca aurait ete plus logique que je mette une id plutot que class. Lien vers le commentaire Partager sur d’autres sites More sharing options...
jcaron Posté 19 Septembre 2009 Partager Posté 19 Septembre 2009 Même si tu ne t'en sers pas dans ce cas précis, ce sont toujours de bonnes habitudes à prendre... Jacques. Lien vers le commentaire Partager sur d’autres sites More sharing options...
Nenex Posté 19 Septembre 2009 Auteur Partager Posté 19 Septembre 2009 Pour les id tu parle ? Lien vers le commentaire Partager sur d’autres sites More sharing options...
jcaron Posté 19 Septembre 2009 Partager Posté 19 Septembre 2009 Pour le fait d'utiliser une "class" pour les propriétés communes à plusieurs objets. Jacques. Lien vers le commentaire Partager sur d’autres sites More sharing options...
Nenex Posté 19 Septembre 2009 Auteur Partager Posté 19 Septembre 2009 mais je trouve pas plus simple que se que je fait moi. Je dit pas que c'est pus complique, mais je trouve que c'est pareil. Lien vers le commentaire Partager sur d’autres sites More sharing options...
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant