Quelle est la différence entre les attributs id et class en HTML ?-tutoriel HTML-php.cn

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

青灯夜游

Libérer： 2019-04-15 11:23:47

original

15114 Les gens l'ont consulté

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

Copier après la connexion

Feuille de style CSS :

#id_name {
    // CSS属性
}

Copier après la connexion

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>

Copier après la connexion

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

Copier après la connexion

Feuille de style CSS :

.class_name {
    // CSS属性
}

Copier après la connexion

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>

Copier après la connexion

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!