j'aimerai savoir s'il y a une possibilité de mettre des boutons personnalisés pour certaines pages (par exemple j'aimerai dans mon menu que la page d'accueil aie un bouton dont la couleur est differente des autres)
Oui c'est possible. Insère le code dans la Source de la page dans la quelle tu veux changer les boutons:
Citation:
<style type="text/css">
<!--
td.nav{background-image: url(URL de l'image de bouton);}
td.nav:hover{background-image: url(URL de l'image de bouton hover);}
-->
</style>
Très beau design, très belle réalisation de menu horizontal ,félicitations!
[quote="webmaster-shop"]Oui c'est possible. Insère le code dans la Source de la page dans la quelle tu veux changer les boutons:
Citation:
<style type="text/css">
<!--UR
td.nav{background-image: url(URL de l'image de bouton);}
td.nav:hover{background-image: url(URL de l'image de bouton hover);}
-->
</style>
svp Erika, faut-il charger un bouton vierge à:
td.nav{background-image: url([b][color=red]URL de l'image de bouton
et le texte à:
td.nav:hover{background-image: url([color=red][b]URL de l'image de bouton hover
que signifie Bouton hover?
et enfin, le texte doit-il être du texte de clavier ou peut-il être une image?
Merci et bonne journée.
Dernière édition par lsdreams le 06.02.2009, 04:12; édité 2 fois
lsdreams,
":hover" signifie "Dessus",concerne l'effet de survol de la souris
Dans ce cas précise , la couleur ou l'image de bouton change au passage de la souris."Quand la souris est sur le lien".
Le code concerne uniquement l'apparence des boutons et non le texte:
Citation:
<style type="text/css">
<!--
td.nav{background-image: url(URL de l'image de bouton);}
td.nav:hover{background-image: url(URL de l'image de bouton hover);}
-->
</style>
Pour définir l'apparence que doivent avoir les liens lorsqu'on pointe dessus,voici un exemple de code CSS:
Citation:
a{
text-decoration: none; /* Les liens ne seront plus soulignés */ color: red; /* Les liens seront en rouge au lieu de bleu */ font-style: italic; /* Les liens seront en italique */
}
a:hover/* Quand le visiteur pointe sur le lien */
{
text-decoration: underline; /* Le lien deviendra souligné quand on pointera dessus */ color: green; /* Le lien sera écrit en vert quand on pointera dessus */
}
a:active /* Quand le visiteur clique sur le lien,la couleur de fond du lien change */
{
background-color: #FFCC66;
Bien sur il existe d'autres possibilités, je ne vais pas tout évoquer ici.Il suffit de l'apprendre la langage CSS.
Tu peux remplacer le texte par une image .Ton image doit avoir la largeur de bouton menu (185 pixel pour Iceblue). Tu peux écrire dessus par exemple Page d'accueil .Il faut télécharger l'image dans l'Administrer mes photo. Aller dans l'éditeur de la page et coller le code suivant a la place de le Titre de la page.
td#nav_Titre de la page{background-image:url(URL de l'image de bouton);}
Insère le code dans les codes de ton design.
La deuxième possibilité:
Insère le code suivant juste après le titre de ta page ,dans l'éditeur de la page.
Citation:
<style type="text/css">
<!--
td#nav_Titre de la page{background-image:url(URL de l'image de bouton);}
--></style>
Le titre de la page doit comporté un seul mot. Les caractères spéciaux sont interdit! Par exemple Page d'accueil ! Tu peut donner comme titre : Accueil , Contact ,ets.
______________
Visitez :
Dernière édition par webmaster-shop le 03.04.2009, 16:59; édité 1 fois
par contre j'ai une autre question qui est en rapport direct avec le sujet mais je ne trouve pas de solution dans le forum : lorsque l'on a mis le code CSS donc dans la boite faite pour le bouton avec l'image ,l'image est bien positionner à gauche dans la boite de navigation mais ,il s'affiche sur le haut de la page aussi et le truc c'est que cela fait tres moche,donc comment remédier à se problème?
de plus j'en profite (pour éviter de surcharger le forum de topic qui ne servent a rien ) car j'ai un autre problème ,je n'arrive pas à modifier les couleurs des barres de navigation et de tout les fond principales même si sur la page de texte j'arrive à y mettre des photos. j'ai fait de grosse recherche sur le forum ,donc au pire si il y a des réponses déjas faite, redirigé moi ,car je ne trouve point.
Bonjour,
ce n'est pas dans les boîtes de droite qu'il faut coller le code css pour les boutons de navigation, mais dans l'éditeur de pages en mode source tout en haut de chaque page.
Ton texte est trop large, tu dois le limiter à 335 pix (max: 550). Raccourcis la longueur de lignes du texte..
Si par barres de navigations tu entends les boutons, alors tu as le code dans le forum.
Bonne continuation. ______________ Artiste-peintre inscrit dans la
www.list-of-important-artists.de
Ah ok moi je coller le code avec l'image c'est a dire se code : <img src =" url de l'image " alt"" /> dans l'éditeur de page dans la partie réservé au nom de la page.
Merci je vais voir sa tout de suite.
Bonjour,
pour les boutons, tu as besoin du code suivant:
<style type="text/css">
<!--
td.nav{background-image: url(ICI URL DE L'MAGE DU PREMIER BOUTON);}
td.nav:hover{background-image: url(ICI URL DE L'MAGE DU SECOND BOUTON);}
-->
</style>
Tu dois d'abord charger les deux images dans "administrer mes photos", puis tu copies l'adresse du lien (click droit sur le nom de l'image dans la liste, puis click gauche sur l'adresse du lien) et tu colles ces liens entre les parenthèses (écriture en rouge).
Enfin, tu copies/colles le code tout en haut de ta page en mode source (petit rectangle en haut et à gauche du menu de l'éditeur de pages).
Les cookies sont de petits textes d'informations que nous ou nos partenaires enregistrons localement sur ton ordinateur via ton navigateur.
Tu peux empêcher l'utilisation de cookies à tout moment en modifiant les paramètres de ton navigateur.
Nous utilisons les cookies suivants, conformes au RGPD :
- Cookies essentiels : sont absolument essentiels pour que le site soit pleinement fonctionnel.
- Cookies optionnels : sont optionnels, et nous aident à améliorer le site web, par ex. en analysant le comportement des utilisateurs sur le site web, et ce sans t'identifier personnellement.
Tu peux trouver plus d'informations dans notre déclaration de confidentialité.