• Changer le style des derniers vistieurs

    Multiples chose existent pour modifier l'esthétique des derniers visiteurs. Dans cette article, nous allons nous intéresser aux :
    > Arrondis
    > Bordures

    RAPPELS :
    - Vous pouvez cliquer sur TOUTES les images pour les voir en plus grand
    - Le code CSS est à placer ici :

    Installer une police et l'utiliser

             A R R O N D I S          

    Pour changer les arrondis de tous les côtés, nous allons faire ce code, tout simplement :


    .module_menu_type_lastvisitors img {
    border-radius:NOMBREpx; }

    border-radius : tout simplement les arrondis. À la place du champ "NOMBRE", il faudra mettre une valeur numérique comprise entre 0 et 50. Plus cette valeur sera élevée, plus les derniers visiteurs seront arrondis.

    Par exemple :
    .module_menu_type_lastvisitors img{border-radius:50px;}
    va donner ça : 

    Changer le style des derniers vistieurs

    Mais si vous voulez par exemple arrondir un côté, mais pas l'autre, il faudra mettre 4 valeurs au lieu d'1 pour préciser les angles :


    .
    module_menu_type_lastvisitors img {
    border-radius : NOMBREpx NOMBREpx NOMBREpx NOMBREpx;
    }

    Mais bon, il faut savoir quel champ représente quel nombre.
    NOMBRE : l'angle en haut à gauche
    NOMBRE : l'angle en haut à droite
    NOMBRE : l'angle en bas à droite
    NOMBRE : l'angle en bas à gauche

    Si vous voulez changer les arrondis au survol, vous allez mettre exactement les mêmes codes en fonction des angles, mais en ajoutant ":hover". Par exemple :
    .module_menu_type_lastvisitors img:hover{border-radius:5px;}

              B O R D U R E S          

    La, le code est unique, mes les valeurs pour la bordure sont multiples.
     


    .
    module_menu_type_lastvisitors img{border:NOMBREpx STYLE #COULEUR ;}
     

     Alors, j'explique.

    border : c'est la propriété des bordures. Tout simplement. Mais il faut que je vous parle de comment cette propriété se remplit.

    NOMBRE : ce premier champ détermine l'épaisseur de la bordure. Il faut donc y mettre un nombre ou un chiffre. Plus la valeur est élevée, plus la bordure sera épaisse.
    STYLE : C'est ben... le style de la bordure. Il en existe 4 :
    solid, la classique quoi, bordure continue
    dotted, la bordure en pointillés
    dashed, la bordure en tirets
    double, la bordure euh... double. Je précise, pour avoir une bordure double, il faut au moins 3px d'épaisseur.

    COULEUR : la couleur de la bordure. je vous conseille de mettre un code hexadécimal après le # pour avoir exactement la couleur que vous souhaitez. Pour ça, un Color Picker Pro est à votre disposition en haut du menu.

    Par exemple :
    .module_menu_type_lastvisitors img{border:2px solid #AA101D;}
    va donner :
    Changer le style des derniers vistieurs

    Pour changer la bordure au survol, c'est la même chose que pour les arrondis : on ajoute simplement :hover.
    Par exemple :
    .module_menu_type_lastvisitors img:hover{border:1px solid #000000;}

     

    > Si vous voulez maintenant changer la taille de vos derniers visiteurs, cliquez ici !

    « Bulle d'aideChanger la taille des derniers visiteurs »

  • Commentaires

    Aucun commentaire pour le moment

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :