Création de sous menus webacappella
Fermé
Claire.T
-
19 janv. 2017 à 10:11
dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 - 19 janv. 2017 à 14:28
dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 - 19 janv. 2017 à 14:28
A voir également:
- Création de sous menus webacappella
- Creation compte gmail - Guide
- Creation de compte google - Guide
- Media creation tool - Télécharger - Systèmes d'exploitation
- Création site web - Guide
- Création groupe whatsapp - Guide
1 réponse
dugenou
Messages postés
6087
Date d'inscription
mercredi 19 janvier 2005
Statut
Contributeur
Dernière intervention
30 juillet 2021
1 452
Modifié par dugenou le 19/01/2017 à 14:55
Modifié par dugenou le 19/01/2017 à 14:55
Bonjour,
Je ne sais pas si Webacapella propose de créer et de personnaliser une feuille de style CSS, si c'est le cas, c'est dans cette feuille de style qu'il faut agir.
Il faut aussi adapter ton menu en fonction de ce que tu veux faire et de ta feuille de style.
Voici un exemple pour un menu déroulant très simple, juste pour que tu comprennes le principe, ne l'utilise pas tel quel, je ne l'ai pas testé (d'autant plus que CCM rajoute automatiquement rel="nofollow noopener noreferrer" target="_blank" aux liens).
La feuille de style :
Le menu :
Si tu cherches un peu sur le Web, tu en trouveras beaucoup d'autres, plus sophistiqués.
Courage, le bout du tunnel n'est pas loin, il suffit de se retourner.
Je ne sais pas si Webacapella propose de créer et de personnaliser une feuille de style CSS, si c'est le cas, c'est dans cette feuille de style qu'il faut agir.
Il faut aussi adapter ton menu en fonction de ce que tu veux faire et de ta feuille de style.
Voici un exemple pour un menu déroulant très simple, juste pour que tu comprennes le principe, ne l'utilise pas tel quel, je ne l'ai pas testé (d'autant plus que CCM rajoute automatiquement rel="nofollow noopener noreferrer" target="_blank" aux liens).
La feuille de style :
/*MENU DEROULANT*/
div#menuDeroulant ul ul {display: none; position: absolute; left: 1px; top: -1px; margin:0px; padding: 0px; border: 1px solid #C0C1C3;}
div#menuDeroulant li {list-style-type: none; position: relative; width: 100px; background-color: #FFFFFF; padding: 4px; margin: 0px}
div#menuDeroulant li:hover {background-color: #C0C1C3;font-weight:bold;}
div#menuDeroulant li:hover ul.niveau2 {display: block}
/*FIN DU MENU DEROULANT*/
Le menu :
<div id="menuDeroulant">
<ul class="niveau1">
<li><a href="index.html" rel="nofollow noopener noreferrer" target="_blank">Accueil</a>
<ul class="niveau2">
<li><a href="presentation.html" rel="nofollow noopener noreferrer" target="_blank">Qui sommes nous</a></li>
<li><a href="projet.html" rel="nofollow noopener noreferrer" target="_blank">Le projet associatif</a></li>
<li><a href="plaquette.html" rel="nofollow noopener noreferrer" target="_blank">La plaquette</a></li>
</ul>
</li>
<li><a href="activite.html" rel="nofollow noopener noreferrer" target="_blank">Activite</a></li>
<li><a href="actualite.html" rel="nofollow noopener noreferrer" target="_blank">Actualite</a></li>
</ul>
</div>
Si tu cherches un peu sur le Web, tu en trouveras beaucoup d'autres, plus sophistiqués.
Courage, le bout du tunnel n'est pas loin, il suffit de se retourner.