Image de l'article Styles CSS en HTML

Styles CSS en HTML

Page 11 | Écouter en audio

Styles CSS en HTML

CSS (Cascading Style Sheets) est un langage de style utilisé pour définir l'apparence et la mise en page d'un document HTML. Avec CSS, vous pouvez séparer le contenu du document de sa présentation visuelle, ce qui rend la maintenance et la mise à jour de votre site plus faciles et plus efficaces.

Il existe trois façons d'ajouter des styles CSS à un document HTML :

  • Styles intégrés : sont appliqués directement à un élément HTML, à l'aide de l'attribut "style".
  • Styles internes : sont définis dans la section "head" du document HTML, à l'aide de la balise "style".
  • Styles externes : sont définis dans un fichier CSS séparé et liés au document HTML via la balise "link".

Quelle que soit la forme choisie, les styles CSS sont composés d'un sélecteur et d'un ensemble de propriétés et de valeurs. Le sélecteur sert à choisir les éléments HTML devant recevoir les styles, tandis que les propriétés et les valeurs définissent l'apparence et la disposition de ces éléments.

Par exemple, le code CSS suivant définit un style pour tous les titres h1 du document :

h1 { La couleur rouge; taille de police : 24 px ; aligner le texte : centrer ; }

Dans ce cas, le sélecteur est "h1" et les propriétés et valeurs définissent la couleur du texte sur rouge, la taille de la police sur 24 pixels et l'alignement du texte sur le centre.

En plus des propriétés de style de base telles que la couleur, la police et la taille, CSS fournit une grande variété de propriétés pour contrôler l'apparence et la disposition des éléments HTML. Certaines des propriétés les plus courantes incluent :

  • background-color : définit la couleur d'arrière-plan de l'élément.
  • bordure : définit la bordure de l'élément, y compris son épaisseur, son style et sa couleur.
  • padding : définit l'espace à l'intérieur de l'élément, entre son contenu et sa bordure.
  • marge : définit l'espace à l'extérieur de l'élément, entre sa bordure et l'élément suivant.
  • display : définit la façon dont l'élément est affiché sur la page, tel que bloc, en ligne ou flexible.
  • position : définit la position de l'élément sur la page, telle que statique, relative ou absolue.

En combinant ces propriétés et ces valeurs, vous pouvez créer des mises en page complexes et personnalisées pour un site Web. Cependant, il est important de se rappeler que le CSS doit être utilisé de manière responsable et efficace, en évitant l'utilisation excessive de styles et en garantissant l'accessibilité et la convivialité du site pour tous les utilisateurs.

Répondez maintenant à l’exercice sur le contenu :

_Lequel des éléments suivants est un moyen d'ajouter des styles CSS à un document HTML ?

Tu as raison! Félicitations, passez maintenant à la page suivante

Vous avez raté! Essayer à nouveau.

Image de l'article Introduction à JavaScript en HTML

Page suivante de lebook gratuit :

12Introduction à JavaScript en HTML

1 minutes

Obtenez votre certificat pour ce cours gratuitement ! en téléchargeant lapplication Cursa et en lisant lebook qui sy trouve. Disponible sur Google Play ou App Store !

Get it on Google Play Get it on App Store

+ 6,5 millions
d'étudiants

Certificat gratuit et
valide avec QR Code

48 mille exercices
gratuits

Note de 4,8/5 dans les
magasins d'applications

Cours gratuits en
vidéo, audio et texte