Organisation et bonnes pratiques CSS — Correction d'exercices

Voici des propositions de solutions en mode console (via readline()). N’hésite pas à les adapter.

#1 — Variables CSS

Déclare une variable '--main-color' avec la valeur #3498db dans le sélecteur :root.

Voir le corrigé

:root {
    --main-color: #3498db;
}

/* Utilisation : color: var(--main-color); */

Selon BEM, comment nommerais-tu le bouton (élément) à l'intérieur d'un bloc 'card' ?

Voir le corrigé

.card__button { ... }

Pourquoi utilise-t-on un fichier 'reset.css' ou 'normalize.css' ?

Voir le corrigé

Pour supprimer les styles par défaut différents selon les navigateurs et partir d'une base cohérente.

Entre un sélecteur de classe '.btn' et une règle sur 'button', lequel est prioritaire ?

Voir le corrigé

La classe (.btn) a une plus grande spécificité que la balise (button).

Comment factoriser deux règles qui partagent les mêmes propriétés ?

Voir le corrigé

h1, h2 {
    font-family: 'Open Sans', sans-serif;
    color: #333;
}