Chargement...

Classes en HTML

Après div, les étiquettes class réutilisables accrochent les styles.

Pourquoi les noms partagés gagnent

Ils gardent des styles cohérents.

Réponse directe

Écrivez class="note", partagez, séparez par des espaces. En CSS .note. Pas de # dans l’attribut.

📊 class in HTML vs CSS

Place	What you write	Role
HTML attribute	class="note"	Labels the element (no leading dot)
CSS selector	.note	Selects elements that have that class
Multiple names	class="card featured"	Space-separated list in HTML
Same idea in CSS	.card.featured	Element that has both classes (advanced combining)

Classe partagée sur plusieurs éléments

Deux paragraphes class="note".

Shared class

html

HTML Code

<p class="note">Save often.</p>
<p class="note">Use clear names.</p>
<style>
.note { color: #0b4; font-weight: 600; }
</style>

Lecture de la classe partagée

les deux note
.note sélectionne le groupe

Plusieurs classes sur un élément

card et featured ensemble.

Multiple classes on one element

html

HTML Code

<div class="card featured">
<h2>Featured tip</h2>
<p>Classes can combine on one box.</p>
</div>
<style>
.card { padding: 12px; border: 1px solid #444; }
.featured { border-color: #0a7; }
</style>

Lecture multi-classes

deux jetons
.card + .featured

Habitudes de nommage

Noms courts et clairs.

Pratique

deux tip
styliser .tip
seconde classe
corriger une faute

Erreurs faciles

dans class
virgules au lieu d’espaces
.note dans le HTML

Résumé

class = crochet CSS/JS
partager et combiner
ensuite : id

🧠 Testez Vos Connaissances

Prêt à Commencer

Testez Vos Connaissances

Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet

❓

Questions

🎯

70%

Pour Réussir

♾️

∞

Temps

🔄

∞

Tentatives

📝 Instructions

Lisez chaque question attentivement
Sélectionnez la meilleure réponse pour chaque question
Vous pouvez refaire le quiz autant de fois que vous le souhaitez
Votre progression sera affichée en haut

Langue