Que signifie la balise en CSS

En CSS, la balise représente un sélecteur, tel que "#tag{style code;}" et ".tag{style code}". Les balises TAG sont des mots-clés auto-définis qui sont plus précis et spécifiques que la classification et peuvent résumer le contenu principal de l'article.

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

En CSS, la balise représente un sélecteur. Par exemple,

#tag{样式代码;}
.tag{样式代码}

Chaque définition de style CSS se compose de deux parties : [code] Sélecteur {style} [/code] La partie avant {} est "sélecteur". " ". Le "sélecteur" spécifie l'objet du "style" dans {}, c'est-à-dire les éléments de la page Web sur lesquels le "style" agit.

Sélecteur de catégorie

Le sélecteur de classe sélectionne en fonction du nom de la classe

Il est marqué d'un "." devant, tel que :

.demoDiv{
color:#FF0000;
}

En HTML, les éléments peuvent définir un attribut de classe.

Par exemple :

<div class="demoDiv">
这个区域字体颜色为红色
</div>

En même temps, nous pouvons définir un autre élément :

<p class="demoDiv">
这个段落字体颜色为红色
</p>

Enfin, en naviguant avec un navigateur, nous pouvons constater que tous les éléments avec la classe demoDiv ont ce style appliqué. Y compris les éléments div et p dans la page.

Dans l'exemple ci-dessus, nous avons défini des classes pour les deux éléments. Cependant, s'il y a de nombreux éléments qui appliqueront cet élément, alors définir les éléments un par un entraînera trop de duplication de code sur la page. Ce phénomène est appelé "multiple". éléments". Symptômes”.

Nous pouvons le changer pour le définir comme ceci.

<div class="demoDiv">
<div>
这个区域字体颜色为红色
</div>
同时，我们可以再定义一个元素：
<p>
这个段落字体颜色为红色
</p>
</div>

De cette façon, nous définissons simplement une classe et appliquons le style à tous les éléments.

Sélecteur d'ID

Le sélecteur d'ID peut spécifier un style spécifique pour les éléments HTML marqués d'un ID spécifique. La sélection des éléments en fonction de leur ID est unique, ce qui signifie que le même ID ne peut apparaître qu'une seule fois dans la même page du document. Par exemple, si vous définissez la valeur ID d'un élément sur « navi », vous ne pouvez pas la modifier à nouveau sur la page. même page. Les autres identifiants d'éléments sont nommés "navi". Bien que vous constatiez que même si vous nommez plusieurs éléments avec le même nom d'identifiant, le sélecteur CSS sélectionnera toujours ces éléments pour appliquer des styles (comme le sélecteur de classe pour les sélecteurs CSS, l'unicité de l'attribut id ne semble pas). être le même. Cependant, pour js, il ne sélectionnera que le premier élément avec le même nom d'identification. En tant que bonne pratique de programmation, le même identifiant ne doit pas apparaître deux fois sur la page.

Il est marqué d'un signe "#" devant, qui peut être défini dans le style comme suit :

#demoDiv{
color:#FF0000;
}

Cela représente le réglage de la couleur de police de l'élément avec l'identifiant de demoDiv sur rouge.

Nous définissons un élément sur la page et définissons son ID comme demoDiv, tel que :

<div id="demoDiv">
这个区域字体颜色为红色
</div>

Naviguez avec un navigateur, nous pouvons le voir car la couleur de la zone devient rouge

définissez une autre zone

<div>
这个区域没有定义颜色
</div>

Utilisez la navigation avec Dans le navigateur, comme prévu, aucun style n'est appliqué à la zone, donc la couleur de la police dans la zone est toujours la couleur noire par défaut.

Apprentissage recommandé : Tutoriel vidéo CSS

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!