Table des matières
Quelle est la différence entre class et id en HTML5 ?
Maison interface Web Questions et réponses frontales Quelle est la différence entre la classe et l'identifiant en HTML5

Quelle est la différence entre la classe et l'identifiant en HTML5

Mar 16, 2022 am 11:41 AM
html

Différences : 1. Différentes portées, la classe a une portée plus grande, tandis que l'identifiant a une portée plus petite ; 2. Différents niveaux de priorité, le sélecteur d'identifiant a une priorité plus élevée, tandis que le sélecteur de classe a une priorité inférieure ; en CSS, la classe est sélectionnée par "." et l'identifiant est sélectionné par "#".

Quelle est la différence entre la classe et l'identifiant en HTML5

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

Quelle est la différence entre class et id en HTML5 ?

id

est un identifiant unique, similaire à notre numéro d'identification. Nous pouvons rapidement obtenir l'objet label et opérer dessus.

Lorsque nous utilisons id pour modifier le style de l'étiquette, nous utilisons #id pour le représenter

Class

pointe vers une classe, c'est-à-dire que s'il y a quatre étiquettes avec le même style, nous l'utilisons pour Pour plus de commodité, placez les styles de ces quatre balises dans une classe. Si nécessaire, nous laissons directement les balises hériter de cette classe Class pour réduire la quantité de code. Si nous avons encore besoin de contrôler avec précision les quatre balises, nous pouvons utiliser id avec class. pour contrôler une étiquette en même temps !

Lorsque nous utilisons Class pour modifier le style de l'étiquette, nous utilisons .Class pour le représenter

La différence est la suivante :

  • La portée de l'action est différente : la portée de la classe est plus grande que celle de l'identifiant, et l'identifiant représente un identifiant unique, comme nos cartes d'identité personnelles, elles sont uniques et ne peuvent être appelées qu'une seule fois sur une page. Généralement, une page Web ne possède pas deux identifiants ou plus. La portée de la classe est plus large. Class est une étiquette de classe et peut être appelée plusieurs fois dans une interface. Peut être réutilisé.

  • Les priorités sont différentes : la priorité du sélecteur d'identifiant est supérieure à la priorité du sélecteur de classe. Pour les plus importants, vous pouvez utiliser le sélecteur d'identifiant.

  • La syntaxe utilisée est différente : la façon dont le sélecteur d'identifiant est utilisé en CSS, par exemple en utilisant div comme exemple : (Par exemple, il y a deux boîtes div : div id='i'... et div class ='c'... respectivement, La méthode citée en css est la suivante :)

.c{
属性:属性值;
} 
#i{
属性:属性值;
}
Copier après la connexion

Tutoriel recommandé : "Tutoriel vidéo html"

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Bordure de tableau en HTML Bordure de tableau en HTML Sep 04, 2024 pm 04:49 PM

Guide de la bordure de tableau en HTML. Nous discutons ici de plusieurs façons de définir une bordure de tableau avec des exemples de bordure de tableau en HTML.

Tableau imbriqué en HTML Tableau imbriqué en HTML Sep 04, 2024 pm 04:49 PM

Ceci est un guide des tableaux imbriqués en HTML. Nous discutons ici de la façon de créer un tableau dans le tableau ainsi que des exemples respectifs.

Marge gauche HTML Marge gauche HTML Sep 04, 2024 pm 04:48 PM

Guide de la marge HTML gauche. Nous discutons ici d'un bref aperçu de la marge gauche HTML et de ses exemples ainsi que de son implémentation de code.

Disposition du tableau HTML Disposition du tableau HTML Sep 04, 2024 pm 04:54 PM

Guide de mise en page des tableaux HTML. Nous discutons ici des valeurs de la mise en page des tableaux HTML ainsi que des exemples et des résultats en détail.

Espace réservé d'entrée HTML Espace réservé d'entrée HTML Sep 04, 2024 pm 04:54 PM

Guide de l'espace réservé de saisie HTML. Nous discutons ici des exemples d'espace réservé d'entrée HTML ainsi que des codes et des sorties.

Liste ordonnée HTML Liste ordonnée HTML Sep 04, 2024 pm 04:43 PM

Guide de la liste ordonnée HTML. Ici, nous discutons également de l'introduction de la liste et des types HTML ordonnés ainsi que de leur exemple respectivement.

Déplacer du texte en HTML Déplacer du texte en HTML Sep 04, 2024 pm 04:45 PM

Guide pour déplacer du texte en HTML. Nous discutons ici d'une introduction, du fonctionnement des balises de sélection avec la syntaxe et des exemples à implémenter.

Bouton HTML onclick Bouton HTML onclick Sep 04, 2024 pm 04:49 PM

Guide du bouton HTML onclick. Nous discutons ici de leur introduction, de leur fonctionnement, des exemples et de l'événement onclick dans divers événements respectivement.

See all articles