Styles et attributs CSS
Styles et attributs CSS |
|
|
MENU
|
|
|
Vous
trouverez dans cette page une bibliothèque des styles et attributs Il
vous sera dès lors posssible de créer vos propres feuilles
de style Quelques
exercices très simplifiés vous sont proposés à
cette étape. |
|
|
TABLE
D'ACCES RAPIDE
|
|
| Police
de caractères : "New Times Roman", Arial, etc. Taille des caractères. Graissage des caratères : Gras, Normal, etc Style de texte : italique Alignement du texte : Ornementation du texte : Clignottant, souligné, surligné... Majuscules - tout majuscules - première lettre - Couleur des caractères du texte Couleur d'arrière-plan du texte |
font-family font-size font-weight font-style text-align text-decoration text-transform color background-color |
|
ATTRIBUTS
DE POLICES DE CARACTERES - font-family -
|
|
Syntaxe font-family : Police1, Police2, "Police 3", etc |
|
Modalités Un choix
de plusieurs polices, par ordre préférentiel décroissant
peut être proposé à l'explorateur Internet. |
|
Les choix de polices les plus courants sont : Arial, Helvetica, sans-serif"Times New Roman", Times, serif "Courier New", Courier, mono Georgia, "Times New Roman" , Times, serif Verdana, Arial, Helvetica, sans-serif |
|
Exemple de règle avec la balise P P { font-family : "Times New Roman", Times, serif } |
|
ATTRIBUTS
DE TAILLES DE CARACTERES - font-size -
|
|
Syntaxe font-size : corps |
|
Corps C'est
le nom que donnent les typographes à la taille des caractères. en pica, exemple : 12pica en em, exemple : 2em en ex, exemple : 0.5ex par des mots-clés prédéfinis : xx-small, x-small, small, medium, large, x-large, xx-large relativement à la taille des caractères précédents : smaller, larger en pourcentage de la taille des caractères précédents, exemple : 75% |
|
Valeurs de corps point
anglais (pt) : 1/72
inch ou 0,352778 mm le "point didot" vaut 0.376065 mm Ne pas confondre le "pica" et le "point pica". En système pica le "point pica" vaut 1/72 inch, soit 0.352778 mm Le "pica" vaut 12 points, soit 4.233 mm |
|
Exemple de règle avec la balise P P { font-family : Arial ; font-size : 12pt} |
|
ATTRIBUT
DE GRAISSE - font-weight -
|
|
Syntaxe font-weight : Valeur |
|
Valeurs de
100 à 900 par incréments de 100 |
|
Exemple de règle avec la balise P P { font-weight : 200 } |
|
Style
de police: font-style
|
|
Seuls les attributs "italic" et "normal" sont reconnus par tous les explorateurs. Ex : P {font-style:italic} |
|
ATTRIBUTS
D'ALIGNEMENT DE TEXTE - text-align -
|
|
Syntaxe text-align : "alignement horizontal" |
|
Valeurs de l'alignement horizontal left, center, right, justify |
|
Exemple de règle avec la balise P P { font-family: Helvetica ; text-align : center } |
|
ATTRIBUTS
DE DECORATION - text-decoration -
|
||
|
Syntaxe text-decoration : "décoration" |
||
|
Valeurs de "décoration"
|
||
| blink line-throughh oveline underline none |
clignottant barré surligné souligné normal |
|
|
|
||
|
ATTRIBUTS
DE MAJUSCULES - text-transform -
|
|
|
Syntaxe text-transform : attribut |
|
|
Attributs
|
|
| capitalize uppercase lowercase none |
Met l'initiale
de chaque mot en majuscules Met toutes les lettres en capitales Met toutes les lettres en minucules Aucun changement |
|
Exemple de règle avec la balise P P { text-transform : capitalize } |
|
|
ATTRIBUT
DE COULEUR DE TEXTE color
|
|
Syntaxe color: couleur |
|
Ce paramètre contrôle la couleur du texte. Exemple de règle avec la balise H1 H1 { font-family : Arial ; color: green } |
|
Codage des couleurs Nous rappelons qu'un attribut de couleur peut s'écrire sous plusieurs formes : Sous
forme héxadécimale : #RRGGBB exemple : #5CFFC2
|
|
ATTRIBUT
DE COULEUR D'ARRIERE-PLAN
|
|
Syntaxe background-color : couleur |
|
Ce paramètre contrôle la couleur d'arrière-plan du texte. |
| Les couleurs d'arrière-plan se désignent de la même manière que les couleurs du texte. (c.f. ci-dessus) |
|
|
|
|