CSS (Cascading Style Sheets) est un langage de style utilisé pour définir l'apparence et la mise en page des documents HTML. Il vous permet de séparer le contenu du document de sa présentation visuelle, ce qui rend la maintenance du code plus facile et plus efficace.
CSS fonctionne en sélectionnant des éléments HTML et en appliquant des règles de style à ces éléments. Les règles de style peuvent définir des propriétés telles que la couleur, la police, la taille, l'espacement, la position, etc.
Pour utiliser CSS dans un document HTML, il est nécessaire de créer un fichier séparé avec une extension .css, qui contient les règles de style. Ce fichier doit être référencé dans le document HTML par la balise <link>
.
La syntaxe CSS de base consiste en un sélecteur, qui indique l'élément HTML à styliser, suivi d'un bloc de déclarations de style, délimité par des accolades. Chaque déclaration de style se compose d'une propriété et d'une valeur, séparées par deux-points et terminées par un point-virgule.
Par exemple, pour définir la couleur d'arrière-plan d'un élément <div>
sur rouge, le code CSS serait :
div {
couleur de fond : rouge ;
}
Il existe plusieurs types de sélecteurs CSS, qui vous permettent de sélectionner des éléments en fonction de leur classe, ID, type, hiérarchie et d'autres critères. De plus, vous pouvez utiliser des pseudo-classes et des pseudo-éléments pour styliser les éléments en fonction de leur état ou de leur position.
CSS prend également en charge l'utilisation d'unités de mesure, qui peuvent être fixes (comme les pixels) ou relatives (comme le pourcentage ou em). Les unités relatives sont particulièrement utiles pour créer des mises en page réactives qui s'adaptent à différentes tailles d'écran.
En bref, CSS est un outil fondamental pour créer des pages Web bien structurées et visuellement attrayantes. Avec lui, il est possible de séparer la présentation visuelle du contenu du document, facilitant la maintenance et la mise à jour du code. De plus, CSS offre plusieurs options pour les sélecteurs, les propriétés et les unités de mesure, vous permettant de créer des mises en page flexibles et réactives.