Classe vs ID
Les feuilles de style en cascade (CSS) sont un langage qui décrit l'apparence et la mise en forme d'un document rédigé à l'aide d'un langage de balisage. CSS est largement utilisé pour styliser les pages Web écrites en HTML. CSS permet de spécifier vos propres sélecteurs de style en plus d'appliquer des styles pour les éléments HTML. Cela se fait à l'aide des sélecteurs d'ID et de classe. Lors de la spécification d'un style pour un seul élément unique, le sélecteur d'ID est utilisé. Lors de la spécification d'un style pour un groupe d'éléments, le sélecteur de classe est utilisé.
Qu'est-ce qu'une classe?
En CSS, le sélecteur de classe peut être utilisé pour appliquer votre propre style à un groupe d'éléments. Le sélecteur de classe est utilisé pour appliquer un style spécifique à un ensemble d'éléments de la même classe. En CSS, un sélecteur de classe est identifié par un point (.). Voici un exemple de sélecteur de classe défini en CSS.
. Ma classe {
Couleur bleue;
poids de la police: gras;
}
HTML peut faire référence à la classe définie dans CSS en utilisant la classe d'attribut comme indiqué ci-dessous.
C'est ma mise en forme
C'est à nouveau ma mise en forme
Comme indiqué ci-dessus, la même classe peut être utilisée pour plusieurs éléments et un seul élément peut utiliser plusieurs classes. Lorsque plusieurs classes sont utilisées dans le même élément, les classes sont insérées dans l'attribut de classe délimité par un espace comme indiqué ci-dessous.
Ceci est ma mise en forme en utilisant deux classes
Qu'est-ce qu'un identifiant?
En CSS, le sélecteur d'ID peut être utilisé pour appliquer votre propre style à un seul élément unique. En CSS, un sélecteur d'ID est identifié par un hachage (#). Voici un exemple de sélecteur d'ID défini dans CSS.
#ma pièce d'identité {
La couleur rouge;
text-align: droite;
}
HTML peut faire référence au sélecteur d'ID défini dans CSS en utilisant l'ID d'attribut comme indiqué ci-dessous.
Ceci est ma mise en forme d'un sélecteur d'identifiant
Les identifiants sont uniques. Par conséquent, chaque élément ne peut avoir qu'un seul ID et chaque page ne peut avoir qu'un seul élément avec cet ID spécifique. Les identifiants ont une caractéristique importante qui peut être utilisée avec un navigateur. Si l'URL de la page contient une valeur de hachage (par exemple https://myweb.com#my_id), le navigateur essaiera de localiser automatiquement l'élément avec l'ID «my_id» et fera défiler la page Web pour afficher cet élément. C'est une des raisons pour lesquelles la page doit avoir un seul élément avec cet ID spécifique, afin que le navigateur puisse localiser cet élément.
Quelle est la différence entre Class et ID?
Même si le sélecteur de classe et le sélecteur d'ID peuvent être utilisés pour appliquer votre propre style aux éléments d'une page Web, ils présentent des différences importantes. Le sélecteur de classe peut être utilisé pour appliquer votre propre style à un groupe d'éléments, tandis que le sélecteur d'ID est utilisé pour appliquer un style à un seul élément unique. Lors de l'utilisation d'ID, chaque élément ne peut avoir qu'un seul ID et chaque page ne peut avoir qu'un seul élément avec cet ID spécifique, mais la classe peut être utilisée pour plusieurs éléments et un seul élément peut utiliser plusieurs classes. De plus, ID peut être utilisé pour faire défiler une page automatiquement pour afficher l'élément avec cet ID, mais ce n'est pas possible avec le sélecteur de classe.