-
Boutons menu pour colonne ou article
exemple ici
--------------------------
Code à coller dans le Css
/*bouton menu */
#cssmenu,#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
margin: 0;
padding: 0;
border: 0;
list-style: none;
line-height: 1;
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cssmenu {
width: 200px;
font-family: Helvetica, Arial, sans-serif;
color: #ffffff;
}
#cssmenu ul ul {
display: none;
}
#cssmenu > ul > li.active > ul {
display: block;
}
.align-right {
float: right;
}
#cssmenu > ul > li > a {
padding: 15px 10px;
border-left: 3px solid #1682ba;
border-right: 3px solid #1682ba;
border-top: 2px solid #1682ba;
border-bottom: 2px solid #1682ba;
cursor: pointer;
z-index: 1;
font-size: 14px;
font-weight: bold;
text-decoration: none;
color: #ffffff;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
background: -webkit-linear-gradient(#36aae7, #1fa0e4);
background: -moz-linear-gradient(#36aae7, #1fa0e4);
background: -o-linear-gradient(#36aae7, #1fa0e4);
background: -ms-linear-gradient(#36aae7, #1fa0e4);
background: linear-gradient(#36aae7, #1fa0e4);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);
}
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li.active > a,
#cssmenu > ul > li.open > a {
color: #000000;
background: -webkit-linear-gradient(#1fa0e4, #1992d1);
background: -moz-linear-gradient(#1fa0e4, #1992d1);
background: -o-linear-gradient(#1fa0e4, #1992d1);
background: -ms-linear-gradient(#1fa0e4, #1992d1);
background: linear-gradient(#1fa0e4, #1992d1);
}*
Ce que vous pouvez modifier dans le code
-----------------------------------------------
ce qui est en rouge = la largeur du bouton
en vert = les marges du texte
en orange = les bordures du cadre
en bleu = la taille et la couleur du texte
en rose = la couleur des boutons
attention !! sur la ligne des background , placez deux couleurs proches l'une de l'autre
à répéter dans les cinq lignes ( regardez ce qui est en rose dans le code)
*
pour les menus survoler
---------------------------
en mauve = la couleur du texte
en bordeaux = La couleur du bouton
*
Un tout grand merci à Nono 59 pour m'avoir permis de vous offrir ce code
Vous pouvez visiter son magnifique blog ICI et lui dire personnellement merci
*