• Champs de texte "Rechercher" & "Newsletter"  Champs de texte "Rechercher" & "Newsletter"

    Lire la suite...


    votre commentaire
  • Personnalisez le texte sur votre blog avec du CSS (et HTML).  La police, la taille, le style et l'alignement...

    /!\ À savoir : évidemment, à la place de #selecteur, vous mettez votre sélecteur.

    1- Le code :

    #sélecteur {font-family: NOM DE LA POLICE;}

    Note 1: Toutes les polices ne sont pas lues par tous les navigateurs, vous pouvez donc en mettre plusieurs. Exemple: {font-family: Arial, calibri, georgia;}, si le navigateur ne peut pas lire la première police, il utilisera la deuxième, ou la troisième etc. Cette méthode est plus utile pour les polices standards, arial, calibri, times new roman etc.

    Note 2: Pour les polices un peu plus "spéciales/particulières", je vous recommande de suivre ce tuto afin que votre police soit visible par tous vos visiteurs quel que soit le navigateur utilisé.

     

    2- La taille 

    #sélecteur {font-size: Xpx;}

     

    3- La couleur

    #sélecteur {color: #000000;}

    Note: Pour la couleur, vous avez le choix entre mettre le nom de la couleur en anglais, (red, green, grey etc.), ou pour des couleurs plus spécifiques/précises, les codes HTML: #000000, #333333 etc.

     

    4- Le style

    #sélecteur {font-style : italic;} /*- en italique -*/

    #sélecteur {font-style : underline;} /*- souligné -*/

     

    #sélecteur {font-weight: bold;}  /*- gras -*/

    #sélecteur {font-variant: small-caps;}  /*- en lettre capitale -*/

     

    #sélecteur { text-transform: uppercase;}  /*- Majuscule -*/

    Note: J'ai tout mis dans le même point, mais vous pouvez voir que pour mettre du texte en gras ou en majuscules, la propriété n'est pas la même que pour mettre en italique.

     

    5- Espacement des lettres

    #sélecteur { letter-spacing: Xpx;} 

     

    6- Alignement

    #sélecteur {text-align: left;} /*- texte à gauche -*/

    #sélecteur {text-align: right;}  /*- texte à droite -*/

    #sélecteur {text-align: center;}  /*- texte centré-*/

    #sélecteur {text-align: justify;} /*- texte justifié-*/

     

    8 - Mise en page

    Afin d'embellir votre mise en page et la rendre plus harmonieuse, vous avez aussi la possibilité de jouer sur la mise en page. Par exemple, ajouter un alinéa, rendre la première lettre de paragraphe plus grand, etc.

    • Alinéa

    #selecteur {

        text-indent15px

    }

     

    • Première lettre du paragraphe personnalisée

    p::first-letter {
        color: red;
        font-size: 130%;
    }

    9- NOTE :

    Si par exemple, vous souhaitez personnaliser un tableau sur votre blog, vous pouvez également utiliser les propriétés données ci-dessus (font-family, font-size etc.). Les propriétés sont les mêmes en HTML.


    votre commentaire
  • Fonds

    Si vous débutez avec eklablog, vous devez voir ce message assez souvent. La solution a ce problème ? Le CSS, pas d'inquiétude pour les débutants, c'est très simple.

     

    Lire la suite...


    4 commentaires
  • Filtres sur image

    Voici 6 filtres à mettre sur des images. (grayscale, sepia, blur, saturate, invert, bridhtness)

    Pour cet exemple je vais mettre les filtres sur mes derniers visiteurs.

     

    Lire la suite...


    10 commentaires


    Suivre le flux RSS des articles de cette rubrique
    Suivre le flux RSS des commentaires de cette rubrique