Synthèse css
Pour lier une feuille de style : (à insérer dans la partie du document HTML).
Une règle CSS s’écrit comme suit:
sélecteur {propriété: valeur;}
Par exemple : p {font-size: 11px;}
Propriétés CSS vues dans le module :
Propriété Valeur(s) Description font-family Arial, Helvetica, sans-serif
Verdana, Arial, Helvetica, sans-serif
"Times New Roman", Times, serif
"Courier New", Courier, mono
Georgia, "Times New Roman", Times, serif
Geneva, Arial, Helvetica, sans-serif Définit la liste des polices de caractère appliquée au sélecteur font-size [valeur numérique] [px,pt,em,%,…] medium small smaller large larger … Définit la taille du texte font-style normal italic oblique Définit le style (l’inclinaison) du texte font-weight lighter normal bold bolder 100, 200, … Définit l’épaisseur, la « graisse » du texte color [nom de couleur (en anglais)]
#[code couleur] Définit la couleur du texte text-align left, right, center, justify Définit l’alignement du texte
Syntaxe d’une classe :
.styleperso{…}
Application d’une classe au sein d’une balise :
… … …
Formatage d’un morceau de texte: … … …
Formatage d’un bloc de texte: … … …
Propriété
Valeur(s)
Exemple
background-image
[URL, chemin vers l’image] body{ background-image : url(images/fleur.gif);
}
background-repeat repeat (= valeur par défaut) repeat-x repeat-y no-repeat body{ background-image : url(images/fleur.gif); background-repeat:repeat-y; } background-attachment fixed scroll(= valeur par défaut) body{ background-image : url(images/fleur.gif); background-attachment:scroll; } list-style-image [URL, chemin vers l’image] ul{ list-style-image:url(images/fleche.gif);
}
Suppression du souligné : text-decoration: none;
Sélecteur Description a Tous les liens hypertextes, quel que soit leur état a:link Les liens hypertextes non visités a:hover Les liens hypertextes survolés