Il est indispensable de connaître, même si certaines applications fondamentales vous sont encore inconnues, quelques règles de présentation qu'il faut impérativement respecter.

 

Les parenthèses ( ) , les accolades { } , les crochets [ ] et les guillemets simples -' - ou doubles - " - doivent toujours aller par paire. (une ouverture et une fermeture)

 

Les feuilles de style ne sont pas sensibles à la casse et écrire class ou Class ou CLASS donne le même résultat.

Mais comme toujours il existe des exceptions qui seront signalées le moment venu. De ce fait il peut y avoir dans la même page des instructions quand même sensibles à la casse et d'autres non mais, pour l'instant évitez d'y penser !

On parle de "case sensitive" pour un code sensible à la casse. En typographie la casse d'un caractère est soit MAJUSCULES soit minuscules. Ce terme date de l'époque où les typographes rangeaient leurs caractères en plomb dans des tiroirs avec les minuscules dans les tiroirs du bas d'où le terme employé "bas de casse".

 

---

Vous pouvez écrire

H1 { font-family: arial, sans-serif ; }
H1 { font-size: 12pt ; }
H1 { font-weight: bold ; }
H1 { font-style: italic ; }
H1 { line-height: 14pt ; }

 

ou mieux

 

H1
{
font-family: arial, sans-serif ;
font-size: 12pt ;
font-weight: bold ;
font-style: italic ;
line-height: 14pt ;
}

et aussi en style "condensé"

H1 { font-family: arial, sans-serif ; font-size: 12pt ; font-weight: bold ; font-style: italic ; line-height: 14pt ; }

 

mais attention de ne pas couper les mots de la manière suivante, c'est pas reconnu par les navigateurs :

H1 { font-family: arial ; sans
-serif ; font-size: 12pt ; font-
weight: bold ; font-style: italic ; line-height: 14pt ; }

---

Vous pouvez écrire

H1 , H2 { color: blue ; }
H3 , H4 , H5 { color: red ; }
H6 { color: black ; }

Mais vous ne pouvez pas écrire

H1 , H2 { color: blue ; }
H3 , H4 & H5 { color: red ; }
H6 { color: black ; }

- car le signe & n'est pas autorisé et tout votre bloc " H3, H4 & H5 {color: red; } " annulera les effets de la valeur choisie "red" pour les sélecteurs H,... H4, H5

Vous ne pouvez pas écrire non plus

H1 H2 { color: blue ; }
H3 , H4 , H5 { color: red ; }
H6 { color: black ; }

car entre les sélecteurs de H1 et H2 il manque la virgule de séparation.

---

Vous ne pouvez pas écrire

H1 { color: red ; font-style: 12pt ; }
P { color: blue ; font-vendor: any ; }

Première ligne, le sélecteur "font-file" annonce une valeur invalide de 12pt qui n'existe pas pour lui, et deuxième ligne, "font-vendor" n'est pas reconnu'.

Code retenu par le navigateur

H1 { color: red ; }
P { color: blue ; }

Les éléments non reconnus sont sans effet et inutilisables.

Sommaire CSS... @ ... Propriété "font-family"