Classe vs ID
Cascading Style Sheets (CSS) est un langage qui décrit l'apparence et la mise en forme d'un document écrit à 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 aux é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: bleu;
font-weight: gras;
}
HTML peut faire référence à la classe définie dans CSS en utilisant la classe d'attributs comme indiqué ci-dessous.
Ceci est mon formatage
C'est encore mon formatage
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 class délimité par un espace comme indiqué ci-dessous.
Ceci est mon formatage 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 dièse (). Voici un exemple de sélecteur d'ID défini dans CSS.
mon_ID {
couleur: rouge;
text-align:right;
}
HTML peut faire référence au sélecteur d'ID défini dans CSS en utilisant l'attribut id comme indiqué ci-dessous.
Ceci est ma forme de formatage d'un sélecteur d'ID
Les identifiants sont uniques. Par conséquent, chaque élément ne peut avoir qu'un seul identifiant et chaque page ne peut avoir qu'un seul élément avec cet identifiant 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.commy_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 l'une des raisons pour lesquelles la page devrait 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 la classe et l'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.
