Menu "complexe" en CSS

Fermé
peregrina Messages postés 23 Date d'inscription mardi 17 février 2009 Statut Membre Dernière intervention 13 novembre 2021 - 8 mars 2011 à 10:39
Thordendall Messages postés 2453 Date d'inscription mardi 9 novembre 2010 Statut Membre Dernière intervention 3 mars 2024 - 8 mars 2011 à 14:59
Bonjour,

Je suis en train de faire le css du site web d'une organisation. Je suis plus "designer" que "codeuse", donc j'ai laissé aller mon imagination mais là je suis bloquée avec le css puor mon menu. En effet mon menu est composé de 6 sections, et devant le titre de chaque section il y a un triangle en couleur, qui change selon la section. Par exemple

triangle bleu - Titre de la section 1
triangle orange - Titre de la section 2
triangle jaune - Titre de la secion 3

etc.

Est-ce que une âme charitable serait gentille de bien vouloir m'aider svp?
Merci et bonne journée

A voir également:

3 réponses

Thordendall Messages postés 2453 Date d'inscription mardi 9 novembre 2010 Statut Membre Dernière intervention 3 mars 2024 752
8 mars 2011 à 11:43
Bonjour, je ne comprend pas vraiment.
Ton menu est en colonne ou en ligne? Le triangle peut être l'image de fond des div.
Tu utilise quel logiciel?
Cordialement!
0
peregrina Messages postés 23 Date d'inscription mardi 17 février 2009 Statut Membre Dernière intervention 13 novembre 2021
8 mars 2011 à 14:09
Salut,

c'est un menu vertical en colonne (aligné à gauche). J'utilise Dreamweaver.

merci d'avance.

Cordialement
0
Thordendall Messages postés 2453 Date d'inscription mardi 9 novembre 2010 Statut Membre Dernière intervention 3 mars 2024 752
Modifié par Thordendall le 8/03/2011 à 14:59
Bon et bien tu crée des div et en image de fond, tu met l'image de ton triangle!
Moi ce que je fais c'est que je crée un bouton avec l'image que je veux, et je le met en image de fond d'une div qui a un lien vers la section voulue.
Je te montre le code:


<div id="menu">

<a id="bouton1" href="conseils.html"> </a>
<a id="bouton2" href="electricite.html"> </a>
<a id="bouton3" href="refection.html"> </a>
<a id="bouton4" href="meubles.html"> </a>
<a id="bouton5" href="urgences.html"> </a>
<a id="bouton6" href="plomberie.html"> </a>

</div>

et le CSS ca donne ça:

#bouton1 {
background-image:url(boutons/conseils1.png);
background-position:top center;
background-repeat:no-repeat;
height: 90px;
width: 90px;
}
Sachant que l'image de fond change sur #bouton2 #bouton3 etc...
Voilà

Je ne suis pas folle, je suis juste un Pingouin ^^
0