• Codes CSS/HTML

    Cette toute nouvelle rubrique sera dédiée aux codes CSS et HTML (que j'aime beaucoup beaucoup).

    Les codes sont en particuliers des codes de base. Je suis pas très forte en code (bon me débrouille quoi) donc me demandez pas des codes trop compliqués (vous pouvez me faire des requêtes j'essaierai de faire de mon mieux mais sinon allez-ici). Mais si vous avez un problème avec un code je peux toujours essayer d'y remédier.~

     

    LIENS UTILES ↓

     PALETTE DE COULEURS

  • CODES CSS

    ARRONDIR LES AVATARS

    .module_menu_type_lastvisitors img {
    border-top-left-radius: Xpx; /*en haut à gauche*/
    border-top-right-radius: Xpx; /*en haut à droite*/
    border-bottom-right-radius: Xpx; /*en bas à droite*/
    border-bottom-left-radius: Xpx; /*en bas à gauche*/
    }

    → Remplacez les X par une valeur chiffrée (50 pour être rond).

     

    CHANGER LA TAILLE DES AVATARS

    .module_menu_type_lastvisitors img {
    max-height: Xpx; /*hauteur maximale*/
    max-width: Xpx; /*largeur maximale*/
    margin-left: Xpx; /*marge extérieure à gauche de chaque avatar*/
    margin-bottom: Xpx; /*marge extérieure en bas de chaque avatar*/
    padding: Xpx Xpx Xpx Xpx; /*marge intérieure de chaque avatar*/}

    → Remplacez les X par une valeur chiffrée.

     

    BORDURE DES AVATARS

    .module_menu_type_lastvisitors img {
    border: Xpx solid #couleur;}

    → Remplacez X par une valeur chiffrée (taille de la bordure) et couleur par une couleur sous cette forme : #D35A9F.

     

    OPACITÉ DES AVATARS

    .module_menu_type_lastvisitors img{opacity: X;}

    → Remplacez X par une valeur ≤0.

     

    ROTATION DES AVATARS

    .module_menu_type_lastvisitors img:hover {
    -webkit-transform
    : rotate(Xdeg);
    -moz-transform: rotate(Xdeg);
    -o-transform: rotate(Xdeg);
    transform: rotate(Xdeg);
    -webkit-transition: Xs;
    -moz-transition: Xs;
    -o-transition: Xs;
    transition: Xs;}

    → Remplacez X par une valeur ≤360 (c'est le degrés de rotation) et X par une valeur chiffrée (à savoir que c'est le temps en secondes et que 5s c'est long).

     

    AVATARS EN NOIR ET BLANC

    Pour que les avatars soient en noir et blanc.

    .module_menu_type_lastvisitors img {
          -webkit-filter: grayscale(1);
          -moz-filter: grayscale(1);
          -o-filter: grayscale(1);
          filter: grayscale(1);
    }

    Pour que les avatars soient en couleur au survol.

    .module_menu_type_lastvisitors img:hover {
          -webkit-filternone;
          -moz-filter: none;
          -o-filter: none;
          filter: none;
    }

     

    DÉPLACER LE MENU

    .module_menu_type_lastvisitors{
              position: absolute;
              top: Xpx; /*espace entre le haut et le menu*/
              left: Xpx; /*espace entre la gauche et le menu*/
              min-widthXpx; /*largeur minimale*/
              max-widthXpx;} /*largeur maximale*/

    → Remplacez  absolute par fixed si vous voulez que le menu sois toujours à se place quand vous descendez) et X par une valeur chiffrée. min-width et max-width permettent d'avoir le menu toujours de même taille.


    J'espère que ça servira à certains ! Si vous avez un problème n'hésitez pas.


    4 commentaires