• ~ Changer d'image quand le Header est survolé par votre curseur :

    #header: hover {

    opacity: 100;

    background-image: url("URL DE L'IMAGE");

    background-repeat: no-repeat; }

     

    Ce code vous permet de passer à une autre image (Header) quand vous passez la souris sur votre Header. Le "hover" est la fonction "par dessus" ou "survolée", c'est cette fonction qui définit si l'image change ou pas qu'en elle est survolée par votre curseur. Ensuite nous avons la fonction déterminant l'opacité de votre image survolée, vous pouvez modifier le code en orange pour donner plus ou moins d'effet à votre image. Puis nous avons les fonctions "background", une pour insérer l'image choisie et une autre pour ne pas répéter l'image, c'est à dire pour n'avoir qu'une seule fois l'image dans votre Header. Le code en rouge "URL DE L'IMAGE" est la source de votre image. Si vous êtes sur la plateforme Eklablog et que vous souhaitez insérer une image se trouvant dans votre ordinateur et non sur le web, alors il faut upload cette même image dans vos fichiers Eklablog.

    Démonstration :

    Changer le Header survolé

    Changer le Header survolé

    Changer le Header survolé

    Voilà vous avez votre adresse URL à insérer dans votre code !

    Il faut savoir que ce code peut foncitonner pour d'autres images, le footer, les images du contenu et des menus, il suffit de changer le "#header" par "#footer" etc

     

     

    J'espère que ce code vous sera utile, si vous avez des questions n'hésitez pas, bye ~

    (un commentaire fait toujours plaisir)


    2 commentaires
  • ~Placer un module dans le Header (derniers articles) :

    .module_menu_type_lastarticles

    { positionabsoluteleft: 32pxtop240px;
        -webkit-transform: rotate(-20deg)-moz-transform: rotate(-10deg);
    -ms-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    }

     

    Ce qui est écris en noir représente le type du module, vous pouvez le changer. Ce qui est écris en bleu représente le sélecteur (".module_contenu ..."). Ce qui est écris en blanc est la propriété d'affichage. Ce qui est écris en rouge représente la valeur du code. Ce qui est écris en vert représente la distance entre votre module et le bord gauche (left), puis le haut (top). Tout ce qui est écris en violet correspond à la rotation de votre module, vous pouvez modifier la partie verte. Pour mettre un autre module simple, c'est-à-dire non prédéfinis par Eklablog il vous suffit de faire un clic droit sur votre module et choisir "Inspecter".

    Supprimer le titre d'un module

    Un code sera surligné et vous verrez un numéro tel que 151289184. Il ne vous reste plus qu'à remplacer "lastvisitors" par votre numéro. Ou alors pour un module prédéfini tel que les derniers commentaires vous pouvez mettre "lastcomments" etc

    Supprimer le titre d'un module

     

    ~Placer derniers visiteurs dans le Header :

    .module_menu_type_lastvisitors

    position: absolutetop: 0px; left: 20px;}

     

    Voilà pour cet article, si vous avez des questions n'hésitez pas ! Bye ~


    votre commentaire
  • ~Ombre portée Titre contenu :

    .module_titre { text-shadow: 1px 1px 1px #000000; }

     

    Ce qui est écris en noir représente la propriété "ombre portée du texte" en anglais. Ce qui est écris en bleu représente le sélecteur (".module_contenu ..."). Ce qui est écris en rouge représente la valeur de la couleur en hexadécimal (c'est-à-dire # suivis d'un code de 6 chiffres et/ou lettres), le code 000000 équivaut au noir, vous pouvez le changer en allant sur le site suivant : Code couleur. Ce qui est écris en vert représente la "taille" de votre ombre (son épaisseur).

     

    ~Ombre portée article/contenu :

    .module_contenu { box-shadow: 1px 2px 30px #000000; }

     

    Ce qui est écris en noir représente la propriété "ombre portée du contenu" en anglais. Ce qui est écris en bleu représente le sélecteur (".module_contenu ..."). Ce qui est écris en rouge représente la valeur de la couleur en hexadécimal (c'est-à-dire # suivis d'un code de 6 chiffres et/ou lettres), le code 000000 équivaut au noir, vous pouvez le changer en allant sur le site suivant : Code couleur . Ce qui est écris en vert représente la "taille" de votre ombre (son épaisseur).

     

    ~Ombre portée images du contenu :

    .module_contenu img { box-shadow: 0px 0px 30px #ffffff ; }

     

    Ce qui est écris en noir représente la propriété "ombre portée du contenu" en anglais mais puisqu'on a rajouté "img" au sélecteur (".module_contenu ...") l'ombre portée sera seulement sur les images. Ce qui est écris en rouge représente la valeur de la couleur en hexadécimal (c'est-à-dire # suivis d'un code de 6 chiffres et/ou lettres), le code ffffff équivaut au blanc, vous pouvez le changer en allant sur le site suivant : Code couleur . Ce qui est écris en vert représente la "taille" de votre ombre (son épaisseur).

     

    ~Ombre portée images des menus (colonnes) :

    .module_menu_contenu img { box-shadow: 1px 1px 20px #000000 ; }

     

    Ce qui est écris en noir représente la propriété "ombre portée du contenu" en anglais mais puisqu'on a rajouté "img" et "menu" au sélecteur (".module_contenu ...") l'ombre portée sera seulement sur les images des menus. Ce qui est écris en rouge représente la valeur de la couleur en hexadécimal (c'est-à-dire # suivis d'un code de 6 chiffres et/ou lettres), le code 000000 équivaut au noir, vous pouvez le changer en allant sur le site suivant : Code couleur . Ce qui est écris en vert représente la "taille" de votre ombre (son épaisseur).

      

    ~Ombre portée de toutes (j'ai bien dis TOUTES) les images :

    img { box-shadow: 0px 0px 30px #ffffff ; }

     

    Ce qui est écris en noir représente la propriété "ombre portée de la page" en anglais mais puisqu'on a rajouté "img" au sélecteur (".module_contenu ...") l'ombre portée sera sur les images. Ce qui est écris en rouge représente la valeur de la couleur en hexadécimal (c'est-à-dire # suivis d'un code de 6 chiffres et/ou lettres), le code ffffff équivaut au blanc, vous pouvez le changer en allant sur le site suivant : Code couleur . Ce qui est écris en vert représente la "taille" de votre ombre (son épaisseur).

     

    Si vous voulez un code plus spécifique il suffit de demander en commentaire :) J'espère que cette article vous aidera ~

     


    6 commentaires
  • ~Supprimer le titre d'un module (derniers visiteurs) :

    .module_menu_type_lastvisitors .module_menu_titre

    { display: none; }

     

    Ce qui est écris en noir représente le type du module, vous pouvez le changer. Ce qui est écris en bleu représente le sélecteur (".module_contenu ..."). Ce qui est écris en blanc est la propriété d'affichage. Ce qui est écris en rouge représente la valeur du code. Par exemple pour supprimer celui d'un module simple, c'est-à-dire non prédéfinis par Eklablog il vous suffit de faire un clic droit sur votre module et choisir "Inspecter".

    Supprimer le titre d'un module

    Un code sera surligné et vous verrez un numéro tel que 151289184. Il ne vous reste plus qu'à remplacer "lastvisitors" par votre numéro. Ou alors pour un module prédéfini tel que les derniers commentaires vous pouvez mettre "lastcomments" etc

    Supprimer le titre d'un module

    J'espère que ce code vous sera utile, bye ~

    (un commentaire fait toujours plaisir)


    5 commentaires