• Éléments/boutons de menu différents styles

    Par Maximum 34 le 18 Mai 2013 à 22:43

    POUR LES BIGLEURS !!
    Fonction agrandir le texte : cliquer sur le texte ci-dessous pour agrandir les caractères 

     

    Pour différencier la couleur texte et/ou fond des boutons d'un menu

    La propriété nth-child(n) permet d'accéder au bouton suivant son rang -n-

    Par exemple pour le deuxième bouton:

    #menu li:nth-child(2) a{ /*couleur du textelien*/
        color:white;
    }

    #menu li:nth-child(2) {/*couleur du fond de bouton*/
        background-color:black;
    }

    Sinon,

    pour le premier bouton:

    #menu li:first-of-type a{
        color:white;
    }

    Pour le dernier:

    #menu li:last-of-type a{
        color:white;
    }

     

    rendu pour  

    first-of-type color:red; width: 120px;

    nth-child(2) color:yellow; width: 220px; 

    last-of-type color:green; width:320px;

    Partager via Gmail Yahoo! Google Bookmarks

    3 commentaires
//script feuille de style suppl