Introduction aux CSS

Le contenu des pages web structuré à l’aide d’HTML peut être présenté de manière plus attrayante grâce aux styles CSS.

Des boites, encore des boites!

Chaque élément d’une page HTML est une boite pouvant être mise en forme à l’aide des styles CSS.

See the Pen CSS : Des boites, encore des boites by Marc/o (@Marc-o) on CodePen.

Écrire un règle CSS

Les règles CSS sont composées des quatre éléments suivants :

  1. un sélecteur;
  2. une déclaration, elle même composée de :
    1. une propriété;
    2. une valeur.

Par exemple, la règle suivante contient une déclaration qui indique au navigateur d’afficher les titres de niveau 1 (le sélecteur h1) d’une couleur (propriété color) rouge (valeur) :

h1 { color : red; }

Où écrire une règle CSS?

Une règle CSS peut être écrite aux trois endroits suivants :

  1. dans un attribut style de l’élément (à éviter);
  2. dans l’en-tête de la page (à éviter);
  3. dans un fichier CSS externe.

Principaux sélecteurs CSS

  • type;
  • classe;
  • identifiant;
  • enfant;
  • Plusieurs autres!

Sources :
Écriture des feuilles de styles (Draillard, p. 110-143)
CSS : Feuilles de style en cascade (Mozilla)
Premiers pas avec CSS (Mozilla)