• Propriété de Texte

    Par Ange-54 dans CSS le 3 Septembre 2013 à 21:52

    Merci à Nagalia

    Le sélecteur du texte est "p" et celui des liens "a".
    Si vous vous voulez par exemple changer ou modifier les textes du menu à gauche, utilisé le sélecteur "#menu1" avec les propriété suivantes :

    Changer la couleur du texte :

    sélecteur{color: #COULEUR;}

    Taille du texte :

    sélecteur{font-size: Xpx;}

    Police du texte :

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

    Alignement :

    sélecteur{text-align: alignement;}

    left => gauche
    right => droite
    center => centré
    justify => justifié

    Espacer les lettres :

    sélecteur{letter-spacing: Xpx;}

    Souligner / Surligner / barrer

    sélecteur{text-decoration: valeur;}

    underline => soulignement.
    overline => surlignement.
    line-through => barrage.
    none => rien

    "Graisse" du texte :

    sélecteur{font-weight: valeur;}

    lighter => le texte est affiché en léger.
    normal => le texte est affiché en normal.
    bold => le texte est affiché en gras.
    bolder => le texte est affiché en très gras

    "Inclinaison" du texte :

    sélecteur{font-style : valeur; }

    normal => met le texte dans son aspect normal,
    italic => met le texte en italique,
    oblique => dépend de la police pas de grosse différence avec italic.

    Résumé de ce tutoriel : On peut mettre beaucoup de propriété avec du texte.


    votre commentaire

  • Sélecteurs Généraux

    Par Ange-54 dans CSS le 3 Septembre 2013 à 21:52

    Merci à Nagalia

    Bouton et champ de texte :

    input {propriété: valeur;}

    Image :

    img {propriété: valeur;}

    Lien :

    a {propriété: valeur;}

    Texte :

    p {propriété: valeur;}

    Couleur de sélection de texte :

    ::selection {background:grey}

    votre commentaire

  • Sélécteurs

    Par Ange-54 dans CSS le 3 Septembre 2013 à 21:52

    Merci à Nagalia

    Article :

    .module_contenu {propriété: valeur;}

    Article titre :

    .module_titre {propriété: valeur;}

    Article bas :

    #module_bottom {propriété: valeur;}

    Barre d'outil :

    #menubar {propriété: valeur;}

    Commentaire :

    .comment_normal {propriété: valeur;}

    Commentaire auteur :

    .comment_admin {propriété: valeur;}

    Commentaire avatar :

    .commentavatar {propriété: valeur;}

    Dernier Visiteur :

    .module_menu_type_lastvisitors {propriété: valeur;}

    Fond de fenêtre :

    #body {propriété: valeur;}

    Fenêtre d'information :

    .window {propriété: valeur;}

    Fond de page :

    #background {propriété: valeur;}

    Forum Liste :

    #module_contenu_pageforums {propriété: valeur;}

    Header :

    #header {propriété: valeur;}

    Menu contenu :

    module_menu_contenu_block {propriété: valeur;}

    Menu gauche :

    #menu1 {propriété: valeur;}

    Menu droit :

    #menu2 {propriété: valeur;}

    Menu titre :

    .module_menu_titre {propriété: valeur;}

    Menu de l'en tête :

    #menu {propriété: valeur;}

    Pied de page :

    #footer {propriété: valeur;}

    votre commentaire

  • Base

    Par Ange-54 dans CSS le 3 Septembre 2013 à 21:52
    Merci à Nagalia

    Introduction


      Un code CSS est composé d'un sélecteur, d'une propriété ainsi que d'une valeur :

    sélecteur { propriété : valeur ;
                        propriété : valeur
                      }
     
    • Le "sélecteur". Le sélecteur est un élément sur lequel on va mettre les effets. Ça peut être un texte, des images, un fond de page, etc... 
      Toutes les propriétés sont marqué en anglais. Comme exemple de propriété, on à les bordure, l'ombre, la taille, la couleur...
    • La propriété. La propriété est le nom d'un effet que l'on souhaite mettre sur un texte, une images, etc...
    • Et enfin, la valeur. La valeur change en fonction de la propriété et donc en dépend. Par exemple, si la propriété est une "couleur" on va mettre comme valeur "rouge". Pour une propriété "hauteur" on va mettre 200px...


    Vous remarquerez aussi la ponctuation sur cet exemple ci-dessus. Elle est très importante. Après un sélecteur, vous devez mettre des accolades "{" "}" et entre ces accolades, vous devez mettre des propriétés. Chaque propriété doit être séparé par un point virgule ";"
    Dans Eklablog, si vous oubliez les accolades, vous verrez un message d'erreur qui s'affichera sur votre écran et qui signalera votre erreur. Par contre, si votre code ne fonctionne qu'à moitié il y a de grande chance pour que vous ayez oublier une ponctuation comme un point virgule, ou autre ! Alors relisez-vous bien ! Même deux fois si il le faut ou même plus !

    Les retours à la ligne ne changerons pas le code. Mais il est préférable que vous soignez votre présentation pour pouvoir mieux et également plus facilement vous y retrouver (en cas d'erreur ou autre).

    Il faut bien retenir cette structure pour éviter de réalisé des erreurs. Une fois que vous avez compris ça, on peut passer aux choses sérieuses. 


    votre commentaire