Type de style | Nom de la propriété | Valeur | Exemple / Signification | Description |
Arrière-plan
et couleurs | background-color | Couleur hexadécimale RRVVBB ou nom de la couleur | background-color: #FF0000 | Couleur d'arrière plan |
background-image | URL de l'image | background-image: url(image.jpg) | Image d'arrière plan |
color | Couleur hexadécimale RRVVBB ou nom de la couleur | color: #FF0000 | Couleur du texte |
background-attachment | default, fixed | background-attachment: fixed | Arrière plan statique (qui ne défile
pas avec le texte) |
background-position | Left, top ou encore top/center/bottom,
left/center/right | background-position: top | Positionnement du fond de page (est
buggé dans IE4 PC) |
background-repeat | repeat, repeat x, repeat y (ou x est
le nombre le plus bas de répétitions et y le plus
haut) | background-repeat: repeat 10 | Nombre de répétitions du fond de la
page |
Éléments
Block-Level | width | nombre (pixels ou %), auto | width: 10 | Définit la largeur d'un élément |
height | nombre (pixels ou %), auto | height: 10% | Définit la hauteur d'un élément |
float | none, left, right, both | float: left | Indique si d'autres éléments doivent
ou non être justifiés le long des bords de l'élément
déterminé |
clear | none, left, right, both | clear: none | Définit la direction de justification
des textes et des autres éléments autour de l'élément
déterminé |
Propriétés
des polices | font | Valeur | font-underline: none | Balise suivit d'un attribut, tel que
color |
font-family | Nom de la police, famille de polices
génériques (sans-serif par exemple) | font-family: Arial | Police à utiliser |
font-size | Taille en pourcentage (10%), taille
relative, taille absolue, valeur suivit de l'unitée
de mesure (pixel : px, points : pt) | font-size: 10pt | Taille de police à utiliser (en points) |
font-style | Normal, italic | font-style: normal | Style du texte |
font-weight | Normal, bold, bolder, lighter, nombre
(de 100 à 900, par incrément de 100) | font-weight: bold | Style de texte (gras) |
Propriétés
de positionnement | absolute, relative | - | absolute | Positionnement absolu ou relatif |
left | nombre (pixels ou %) | left: 10% | Positionnement par rapport au bord
gauche de l'écran |
top | nombre (pixels ou %) | top: 100 | Positionnement par rapport au haut
de l'écran |
z-index | nombre | z-index: 10 | - |
visibility | inherit, visible, hidden | visibility: hidden | - |
Propriété
du texte | text-align | left, right, center, justify | text-align: left | Alignement du texte |
text-decoration | underline, line-through | text-decoration: underline | Décoration du texte (souligné ou "entouré") |
text-indent | nombre (pixels ou %) | text-indent: 10 | Définit une marge de tant et tant
de pixels ou % du bord de la feuille pour chaque début
de paragraphe |
text-transform | none, capitalize, uppercase, lowercase | text-transform: none | - |
cursor | text, help, crosshair, w-resize, e-resize,
n-resize, s-resize, nw-resize, ne-resize, sw-resize,
se-resize, default | cursor: help | Style du curseur |
font-variant | - | - | - |
letter-spacing | normal | - | - |
line-height | nombre (pixels ou %) | word-spacing: 10 | - |
word-spacing | nombre (pixels ou %) | word-spacing: 10% | - |
vertical-align | - | vertical-align | - |
Tableaux | border-color | Couleur hexadécimale RRVVBB ou nom de la couleur | #FF0000 | Définit la couleur de la bordure d'un
élément |
border-style | dotted | dahed | ridge | groove |
solid | souble | inset | outset | border-style: inset | Style de la bordure d'un élément |
border-width | longueur (pixel), medium | thin |
thick | border-with: 5 | Définit l'épaisseur de la bordure
d'un élément |
border | taille de la bordure | style de la
bordure | couleur | border: 5 | Définit la taille, le style, et la
couleur de la bordure d'un élément |
margin-top | nombre (pixels ou %), auto | margin-top: 10 | Définit la marge supérieur d'un élément |
margin-left | nombre (pixels ou %), auto | margin-left: 10% | Définit la marge à gauche d'un élément |
margin-right | nombre (pixels ou %), auto | margin-right: 10 | Définit la marge à droite d'un élément |
margin-bottom | nombre (pixels ou %), auto | margin-bottom: 10% | Définit la marge inférieure d'un élément |
margin (shorthand) | nombre (pixels ou %), auto | margin: 10 | Définit toutes les marges d'un élément |
padding-top | nombre (pixels ou %) | padding-top: 10% | Définit l'espace devant être inséré
entre le haut de la bordure et son contenu |
padding-left | nombre (pixels ou %) | padding-left: 10 | Définit l'espace devant être inséré
entre la gauche de la bordure et son contenu |
padding-right | nombre (pixels ou %) | padding-right: 10% | Définit l'espace devant être inséré
entre la droite de la bordure et son contenu |
padding-bottom | nombre (pixels ou %) | padding-bottom: 10 | Définit l'espace devant être inséré
entre le bas de la bordure et son contenu |
padding | nombre (pixels ou %) | padding: 10% | Définit le remplissage des côtés d'un
élément |
border-top-width | longueur (pixel), medium | thin |
thick | border-top-width: medium | Définit l'épaisseur du haut de la
bordure d'un élément |
border-left-width | longueur (pixel), medium | thin |
thick | border-left-width: thin | Définit l'épaisseur de la bordure
gauche d'un élément |
border-right-width | longueur (pixel), medium | thin |
thick | border-right-width: thick | Définit l'épaisseur de la bordure
droite d'un élément |
border-bottom-width | longueur (pixel), medium | thin |
thick | border-bottom-width: 10 | Définit l'épaisseur du bas de la bordure
d'un élément |
border-top | taille de la bordure | style de la
bordure | couleur | border-top: 10 | Définit la taille, le style, et la
couleur du haut de la bordure d'un élément |
border-left | taille de la bordure | style de la
bordure | couleur | border-left: 2 | Définit la taille, le style, et la
couleur de la bordure gauche d'un élément |
border-right | taille de la bordure | style de la
bordure | couleur | border-right: 3 | Définit la taille, le style, et la
couleur de la bordure droite d'un élément |
border-bottom | taille de la bordure | style de la
bordure | couleur | border-bottom: 5 | Définit la taille, le style, et la
couleur du bas de la bordure d'un élément |
Classification
des propriétés | display | block | inline | list-item | none | Respectivement : crée un saut de ligne
et un espace devant et derrière l'élément, supprime
tous les sauts à la ligne, inclut une puce sans utiliser
de marque de liste, affiche les éléments en fonction
des paramètres déjà définis | - |
white-space | normal | pre | nowrap | Respectivement : utilise l'affichage
standard, interprète chaque espace et retour forcé littéralement,
prévient la fragmentation des lignes jusqu'à ce qu'une
balise <br> soit insérée | Définit comment l'espacement d'un
élément doit être affiché |
list-style-type | disc | circle | square | decimal |
lower-roman | upper-roman | owner-alpha | upper-alpha
| none | list-style-type: disc | Type de puce devant être utilisé pour
une liste d'éléments |
list-style-image | URL | list-style-image: url(image.gif) | Indique l'URL d'une puce graphique
devant être utilisée à la place d'une puce standard |
list-style-position | inside | outside | Respectivement : justifie le texte
en dessous de la marque, positionne l'ensemble des lignes
à droite de la marque | Indique comment une marque de liste
sera placée relativement au texte de la liste |
list-style | type de la liste, position, image | list-style: url(puce.gif) inside | Spécifie le style, la position, et
la source d'image des marqueurs de liste |
