HTML Styles


L'attribut HTML style est utilisé pour ajouter des styles à un élément, tels que la couleur, la police, la taille, et bien plus encore.


Exemple

Je suis rouge

Je suis bleu

Je suis grand

Essayez-le vous-même »

L'attribut de style HTML

Définir le style d'un élément HTML peut se faire avec l'attribut style .

L'attribut HTML style a la syntaxe suivante :

< nom_de_tag style=" propriété : valeur; ">

La propriété est une propriété CSS. La valeur est une valeur CSS.

Vous en apprendrez plus sur CSS plus tard dans ce tutoriel.


Couleur de fond

La propriété CSS background-color définit la couleur de fond d'un élément HTML.

Exemple

Définir la couleur de fond d'une page à bleu poudre :

<body style="background-color:powderblue;">

<h1>Ceci est un titre</h1>
<p>Ceci est un paragraphe.</p>

</body>
Essayez-le vous-même »

Exemple

Définir la couleur de fond pour deux éléments différents :

<body>

<h1 style="background-color:powderblue;">Ceci est un titre</h1>
<p style="background-color:tomato;">Ceci est un paragraphe.</p>

</body>
Essayez-le vous-même »


Couleur du texte

La propriété CSS color définit la couleur du texte pour un élément HTML :

Exemple

<h1 style="color:blue;">Ceci est un titre</h1>
<p style="color:red;">Ceci est un paragraphe.</p>
Essayez-le vous-même »

Polices

La propriété CSS font-family définit la police à utiliser pour un élément HTML :

Exemple

<h1 style="font-family:verdana;">Ceci est un titre</h1>
<p style="font-family:courier;">Ceci est un paragraphe.</p>
Essayez-le vous-même »

Taille du texte

La propriété CSS font-size définit la taille du texte pour un élément HTML :

Exemple

<h1 style="font-size:300%;">Ceci est un titre</h1>
<p style="font-size:160%;">Ceci est un paragraphe.</p>
Essayez-le vous-même »

Alignement du texte

La propriété CSS text-align définit l'alignement horizontal du texte pour un élément HTML :

Exemple

<h1 style="text-align:center;">Titre centré</h1>
<p style="text-align:center;">Paragraphe centré.</p>
Essayez-le vous-même »

Résumé du chapitre

  • Utilisez l'attribut style pour styliser les éléments HTML
  • Utilisez background-color pour la couleur de fond
  • Utilisez color pour les couleurs de texte
  • Utilisez font-family pour les polices de texte
  • Utilisez font-size pour les tailles de texte
  • Utilisez text-align pour l'alignement du texte


Vidéo : Styles HTML