Quand utiliser la classe et l'identifiant en CSS

Lorsque le style CSS est appliqué à plusieurs éléments, utilisez class pour le définir ; lorsque le style CSS s'applique à un seul élément, utilisez id pour le définir. Raison : l'identifiant ne peut pas être répété et ne peut être utilisé qu'une seule fois. Un identifiant ne peut être utilisé que pour un seul élément d'étiquette ; la même classe peut être définie sur plusieurs éléments d'étiquette.

L'environnement d'exploitation de ce tutoriel : système Windows 7, version css3, ordinateur Dell G3.

Recommandation du didacticiel : tutoriel vidéo CSS

En plus des sélecteurs en CSS, vous pouvez sélectionner des balises HTML prédéfinies, telles que 3499910bf9dac5ae3c52d5ede7383485, e388a4556c0f65e1904146cc1a846bee , < ;div>. Vous pouvez également choisir un identifiant ou une classe définie par l'utilisateur. La principale différence entre id et class est que id ne peut pas être répété et ne peut être utilisé qu'une seule fois. Un identifiant ne peut être utilisé que pour une seule étiquette. Les classes peuvent être réutilisées et la même classe peut être définie sur plusieurs balises. En fait, la différence entre id et class peut être vue à partir du nom id est l'identifiant et class est la classe.

Alors, quand utiliser l'identifiant et quand utiliser la classe ?

• Lorsqu'un style CSS est utilisé pour plusieurs éléments, utilisez la classe pour le définir.
  

• Lorsque le style CSS n'est appliqué qu'à un seul élément, il est défini à l'aide de l'identifiant.

Par exemple, s'il n'y a qu'une seule barre de navigation supérieure dans chaque page, vous pouvez utiliser l'identifiant pour la définir

<nav id="nav"></nav>
// 或者
<div id="nav"></div>

Par exemple, s'il s'agit d'une liste de produits. a le même style, vous pouvez utiliser la classe pour définir

<ul id="list">
    <li class="list-item">1</li>
    <li class="list-item">2</li>
    <li class="list-item">3</li>
</ul>

Pour plus de connaissances liées à la programmation, veuillez visiter : Enseignement de la programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!