Chapitre 3 : Couleurs, unités et valeurs en CSS

1. Utiliser les couleurs en CSS

Il existe plusieurs façons de définir une couleur en CSS :

• Nom de couleur : red, blue, green, etc.
• Hexadécimal : #ff0000 (rouge), #000000 (noir)
• RGB : rgb(255, 0, 0)
• RGBA (avec transparence) : rgba(255, 0, 0, 0.5)
• HSL : hsl(0, 100%, 50%)

Exemple :

body {
  background-color: #f0f0f0;
  color: rgb(30, 30, 30);
}

2. Les unités en CSS

Les unités définissent les tailles en CSS : marges, polices, largeurs, etc.

• Pixels : px — unité fixe
• Pourcentage : % — relatif au parent
• em : relatif à la taille du texte du parent
• rem : relatif à la taille de la racine (html)
• vw / vh : relatif à la largeur / hauteur de la fenêtre

Exemple :

h1 {
  font-size: 2em;
  margin-bottom: 5vh;
}

3. Valeurs spéciales

• auto : taille automatique (ex: marges ou largeur)
• inherit : hérite de la valeur du parent
• initial : valeur par défaut du navigateur
• unset : réinitialise (héritée ou initiale)

Exemple :

div {
  margin-left: auto;
  margin-right: auto;
}