• ACCUEIL
  • blogger

    4 Menus déroulants simples

    Trois menus très simples, très faciles  à modifier.

    => ces menus viennent de loin... un blogueur tahitien

    1-PETIT MENU DEROULANT SIMPLE
    Exemple de menu hiérarchique en CSS


    CODE



    EXPLICATIONS
    -Les URL sont à indiquer
    -vous pouvez ajouter/supprimer des lignes de menu
    -Couleurs modifiables
    #E0E0E0 => gris fond
    #FFFF70 => jaune fond
    #B0B0B0 => gris foncé bordure


    2- MENU DEROULANT CLASSIQUE & SIMPLE




    CODE




    EXPLICATIONS

    MENU DÉROULANT HORIZONTAL, LARGEUR 600px.
    - le nombre de colonne est limité par la largeur de la page de publication (ici : 600px)
    - pour cet exemple : 4 colonnes d'une largeur de 150px (modifier "width:150px;" à la ligne 24 de la source HTML)
    - la couleur du fond : gris (modifier "background-color:gray;" à la ligne 20 - couleur du texte "color:white;" à la ligne 25 - couleur du texte surligné "color:#FFD700;" à la ligne 30)
    - pour personnaliser les menus : modifier les liens et les titres "<li><a>MENU</a>" à partir de la ligne 62.
    -source http://www.tehoanotenunaa.com/2016/10/menu-deroulant.html
    - ci-dessous le texte HTML inspiré par
    http://css.mammouthland.net/menu-horizontal-deroulant-en-css.php

    3- MENU DEROULANT VERTICAL


    Liste déroulante
    Liste déroulante
    Liste déroulante

    CODE


    EXPLICATIONS
    Peu de modifications :
    -Les URL  à replacer
    -arrière plan ici, en jaune,  avec#f7f2b2
    -il est facile d'ajouter des menus et des sous menus

    4-MENU DEROULANT CACHE


    CODE

    EXPLICATIONS
    Peu de modifications :
    -Les URL  à replacer
    -arrière plan ici, en jaune,  avec#faebd7
    -il est facile d'ajouter d'autres lignes de menus
    -si nécessaire changer la police, sa taille et couleur via :  color:#0000ff; font-family: Verdana; font-size:14px;