Adloun

CSS : mettre en forme le Web (école d'ingénieur) · Chapitre 1 · Application directe du cours

Les horaires aux couleurs de la librairie

Premiers pas en CSS · niveau 1 (application)

Énoncé

Voici la page des horaires de la librairie.


<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="utf-8">
  <title>Horaires — La Librairie du Campus</title>
  <link rel="stylesheet" href="ex5-horaires.css">
</head>
<body>
  <h1>Horaires d’ouverture</h1>
  <p>Du lundi au vendredi, de 9 h à 19 h.</p>
  <p>Le samedi, de 10 h à 18 h.</p>
  <h2>Pendant les examens</h2>
  <p>Ouverture prolongée jusqu’à 21 h.</p>
</body>
</html>

Écrire ex5-horaires.css pour lui appliquer la charte : texte #222 en police système sur fond #faf8f5, titres en Georgia, titre principal bleu nuit #1f3a68, sous-titres ocre #e07a1f.

Corrigé


/* Horaires : la charte de la librairie */
body {
  font-family: system-ui, sans-serif;
  color: #222;
  background-color: #faf8f5;
}

h1,
h2 {
  font-family: Georgia, serif;
  color: #1f3a68;
}

h2 {
  color: #e07a1f;
}

On groupe h1, h2 pour la police et la couleur communes, puis une règle h2 change la couleur des sous-titres. Les deux règles donnent une couleur au <h2> ; c'est la dernière écrite qui l'emporte (même principe qu'à l'exercice 1.7). On aurait aussi pu écrire deux règles séparées sans conflit. Le rendu :

Illustration

100 % gratuit

La suite du chapitre est sur Adloun

Exercice suivant et tuteur

Sans compte : le cours et le premier QCM. Exercices et tuteur : inscription gratuite en 30 secondes, sans carte bancaire.

Le cours du chapitre · Tous les exercices du chapitre

Exercice suivant et tuteur →