Maison  >  Article  >  interface Web  >  Quelle est la différence entre les attributs id et class en HTML ?

Quelle est la différence entre les attributs id et class en HTML ?

青灯夜游
青灯夜游original
2019-04-15 11:23:4715096parcourir

En HTML, nous utilisons souvent les attributs id et class. Ils ont des fonctions similaires, alors quelle est la différence entre eux ? L'article suivant comparera brièvement les attributs id et class en HTML et présentera les différences entre les attributs id et class en HTML. J'espère qu'il sera utile à tout le monde. [Recommandation du didacticiel vidéo : Tutoriel HTML]

Quelle est la différence entre les attributs id et class en HTML ?

Attribut d'identifiant HTML

L'attribut id est un identifiant unique utilisé pour spécifier un document ; par conséquent, id peut être utilisé pour distinguer différents modules au sein d'une page. CSS et JavaScript utilisent l'attribut id pour effectuer des tâches spécifiques pour des éléments uniques. En CSS, l'attribut id est écrit à l'aide du symbole # suivi de l'identifiant.

Syntaxe de base :

HTML :

<element id =“id_name”>

Feuille de style CSS :

#id_name {
    // CSS属性
}

Exemple :

<!DOCTYPE html> 
<html> 
<head> 
	<meta charset="UTF-8">
    <title> HTML id 属性 </title> 
      
    <style> 
        #demo{ 
            color:red; 
            font-size:25px; 
        } 
    </style> 
</head> 
  
<body style="text-align:center"> 
    <h1>Hello World!</h1> 
    <p id="demo">欢迎来到PHP中文网!</p> 
    <p >php从入门到精通,一站式php自学平台!</p> 
</body> 
  
</html>

Sortie :

Quelle est la différence entre les attributs id et class en HTML ?

Attribut de classe HTML

L'attribut class est utilisé pour spécifier un ou plusieurs noms de classe pour les éléments HTML ; l'attribut class peut être utilisé pour n'importe quel élément HTML. CSS et JavaScript peuvent utiliser des noms de classe pour effectuer certaines tâches pour les éléments portant des noms de classe spécifiés. Les noms de classe dans les feuilles de style CSS utilisent le symbole "."

Syntaxe de base :

HTML :

<element class=“class_name”>

Feuille de style CSS :

.class_name {
    // CSS属性
}

Exemple :

<!DOCTYPE html> 
<html> 
<head> 
	<meta charset="UTF-8">
    <title> HTML class 属性 </title> 
      
    <style> 
        .demo{ 
            color:red; 
            font-size:25px; 
        } 
    </style> 
</head> 
  
<body style="text-align:center"> 
    <p class="demo">Hello World!</p> 
    <p class="demo">欢迎来到PHP中文网!</p> 
</body> 
  
</html>

Sortie :

Quelle est la différence entre les attributs id et class en HTML ?

Remarque : Le même nom de classe peut être utilisé plusieurs fois sur la page Apparaît , afin que le même CSS puisse être référencé à plusieurs reprises, réduisant ainsi la charge de travail et la quantité de code.

Résumé

La différence entre les attributs id et class est la suivante : id est unique et ne peut apparaître qu'une seule fois dans la page, au maximum. être appliqué à un seul élément et ne peut pas être utilisé à plusieurs reprises. La classe est universelle et peut apparaître plusieurs fois sur la page et être appliquée à plusieurs éléments.

Ce qui précède représente l’intégralité du contenu de cet article, j’espère qu’il sera utile à l’étude de chacun. Pour un contenu plus passionnant, vous pouvez prêter attention aux colonnes de didacticiels pertinentes du site Web PHP chinois ! ! !

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:
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