Design
Titre de la carte un
Petit texte de description pour tester le rognage, l'ellipsis et l'alignement.
Lire la suite →Titre H2 — Section
Test de paragraphe
Titre H3 — Sous-section
Test de paragraphe
Test de 2e paragraphe
Titre H4 — Détail
Test de paragraphe
Titre H5 — Mineur
Test de paragraphe
Titre H6 — Le plus petit
Test de paragraphe
Voici un paragraphe standard contenant du texte en gras,
du texte en italique, un lien hypertexte,
du texte souligné, du texte barré,
du texte plus petit, un CSS
abrégé, ainsi que du texte en indice et en exposant.
On peut aussi insérer du code en ligne comme margin: 0 auto;,
une variable x, une touche clavier Ctrl + C,
ou une sortie programme Erreur 404.
Boutons & états interactifs
Astuce : survolez, cliquez et tabulez (⇥) sur les boutons pour tester :hover, :active et :focus-visible.
Nouveau
Succès
Attention
Erreur
Cartes (CSS Grid)
Code
Titre de la carte deux
Un autre paragraphe pour vérifier la hauteur variable des cartes dans la grille.
Lire la suite →
UX
Titre de la carte trois
Texte plus long afin de voir comment la carte se comporte lorsqu'il y a davantage de contenu à afficher.
Lire la suite →Accordéon / FAQ
Comment lier mon style.css ?
Avec la balise <link rel="stylesheet" href="style.css"> dans le <head>.
Puis-je modifier la structure HTML ?
Oui, ce fichier n'est qu'un point de départ ; adaptez-le à vos besoins.
Où tester les media queries ?
Redimensionnez la fenêtre du navigateur ou utilisez le mode responsive des outils de développement.
Progression & jauges
Progression :
Jauge :
Messages d'état
Information : ceci est un message neutre.
Succès : l'opération a réussi.
Attention : vérifiez ce point.
Erreur : une action a échoué.