CSS, acronyme de Cascading Style Sheets, est un langage de feuilles de style utilisé pour décrire la présentation d’un document écrit en HTML ou XML (y compris plusieurs langages XML tels que SVG, XHTML, ou encore XUL). CSS décrit comment les éléments doivent être affichés à l’écran, sur du papier, ou encore vocalement. Il permet ainsi de séparer le contenu de la présentation et de la mise en forme d’une page web, offrant ainsi une meilleure flexibilité et maintenabilité du code.
L’utilisation de CSS permet de styliser les éléments HTML en appliquant différentes propriétés et valeurs. Une règle CSS est composée de deux parties principales : le sélecteur et la déclaration. Le sélecteur cible les éléments HTML que l’on souhaite styliser, tandis que la déclaration définit les propriétés à appliquer à ces éléments ainsi que leurs valeurs.
Les sélecteurs CSS peuvent être de différents types :
- Sélecteurs de type : ciblent tous les éléments d’un type spécifique, par exemple
ppour les paragraphes. - Sélecteurs de classe : ciblent les éléments qui possèdent une classe spécifique, définie dans le code HTML à l’aide de l’attribut
class. - Sélecteurs d’identifiant : ciblent un élément spécifique ayant un identifiant unique, défini dans le code HTML à l’aide de l’attribut
id. - Sélecteurs d’attribut : ciblent les éléments ayant un attribut spécifique avec une valeur donnée.
Les propriétés CSS contrôlent divers aspects de la mise en forme des éléments HTML, tels que la couleur, la taille, la police, la marge, le remplissage, etc. Certaines des propriétés CSS couramment utilisées incluent :
color: définit la couleur du texte.font-size: spécifie la taille de la police.font-family: définit la famille de police utilisée.margin: contrôle l’espace autour de l’élément.padding: définit l’espace à l’intérieur de l’élément.background-color: spécifie la couleur de fond de l’élément.border: définit les bordures de l’élément.
Les valeurs des propriétés CSS peuvent être des mots-clés prédéfinis, des nombres avec unités, des couleurs, des URL, ou encore des fonctions.
En CSS, il existe également des sélecteurs avancés qui permettent de cibler des éléments HTML de manière plus spécifique en utilisant des combinaisons de sélecteurs. Parmi ces sélecteurs avancés, on trouve les sélecteurs de descendant, les sélecteurs d’enfant, les sélecteurs de frère, les sélecteurs d’adjacent, etc.
Pour appliquer du CSS à un document HTML, on peut utiliser différentes méthodes : inline, interne et externe. Le CSS en ligne consiste à définir les styles directement dans les balises HTML à l’aide de l’attribut style. Le CSS interne consiste à incorporer les styles dans la balise