• Salut à tous pour ceux qui passe ici et qui veulent des menus comme voila le code. Déjà un grand merci à Lockpine car grace a elle j'ai pu le faire mais aussi je vais le partager avec vous. alors le css:

    .navbar {

    width:200px;

    height:30px;

    overflow:hidden;

    -webkit-transition: all 2s ease;

    -moz-transition: all 2s ease;

    -o-transition: all 2s ease

    }

     

    .navbar:hover{

    height:170px;

    }

     

    .nav  {

    font-family:POLICE;

    text-transform:POLICE;

    font-size:12px;

    margin-bottom:10px;

    margin-top:10px;

    text-align:center;

    background-color:COULEUR;

    color:COULEUR;

    width:200px;

    display:block;

    opacity:1;

    }

     

    .navig a{

    letter-spacing:1px;

    font-family:POLICE;

    text-transform:POLICE;

    font-size:11px;

    text-align:center;

    margin-bottom:2px;

    background-color:COULEUR;

    color:COULEUR;

    border-left:0px solid COULEUR;

    border-right:7px solid COULEUR;

    -webkit-transition: all 0.5s ease;

    -moz-transition: all 0.5s ease;

    -o-transition: all 0.5s ease;

    display:block;

    padding:5px;

    padding-right:0px;

    }

     

    .navig a:hover{

    background-color:COULEUR;

    color:COULEUR;

    border-right:0px solid COULEUR;

    border-left:15px solid COULEUR;

    letter-spacing:2px;

    text-align:center;

    padding-left:40px;

    }

    CHANGE SEULEMENT CE QUI EST EN BLEU!!!!!!!!!!!!!!!!!!!!!!!!!

    Maintenant de HTLM:

    <div class="navbar">

    <div class="nav" style="text-align: center;">TITRE</div>

    <div class="navig" style="text-align: center;"><a href="ADRESSE URL 1">SOUS TITRE 1</a> <a href="ADRESSE URL 2">SOUS TITRE 2</a> <a href="ADRESSE URL 3">SOUS TITRE 3</a> <a href="ADRESSE URL4">SOUS TITRE 4</a> <a href="ADRESSE URL 5">SOUS TITRE 5</a></div> 

    </div>

    Pour en avoir plusieur comme le blog ou autre rien de plus simple copie colle une 2eme ou 3 eme fois le code htlm et refait la même chose. 

    CHANGE SEULEMENT CE QUI EST EN BLEU!!!!!!!!!!!!!!!!!!!!!!!!!

     

    voila bisou a toi ♥

     


    16 commentaires