Le style HTML est utilisé pour modifier ou ajouter le style sur des éléments HTML existants. Il existe un style par défaut pour chaque élément HTML, par exemple. la couleur de fond est blanche, la couleur du texte est noir, etc.
L’attribut style peut être utilisé avec n’importe quelle balise HTML. Pour appliquer un style sur une balise HTML, vous devez posséder les connaissances de base des propriétés css, par exemple : color, background-color, text-align, font-family, font-size, etc.
La syntaxe de l’attribut style est donnée ci-dessous:
style= "property:value"
Style de couleur de texte
La propriété color est utilisée pour définir la couleur du texte.
Voyons un exemple simple de style des balises html par la propriété color de css.
<h3 style="color:green">Ceci est la couleur verte</h3> <h3 style="color:red">Ceci est la couleur rouge</h3>
Résultat :
Ceci est la couleur verte
Ceci est la couleur rouge
Style de couleur de fond
La propriété background-color est utilisée pour définir la couleur d’arrière-plan de la balise HTML.
Voyons un exemple de style de balise html par css, propriété background-color.
<h3 style="background-color:yellow;">Ceci est un arriére plan jaune</h3> <h3 style="background-color:red;color:white">Ceci est un arriére plan rouge</h3>
Résultat :
Ceci est un arrière plan jaune
Ceci est un arrière plan rouge
Famille de polices font-family
La propriété font-family spécifie la famille de fonts d’une balise HTML.
Voyons un exemple de style de la propriété font-family .
<h3 style="font-family:times new roman">Ce font est le times new roman</h3> <p style="font-family:arial">Ce font est arial</p>
Résultat :
Ce font est le times new roman
Ce font est arial
Le style font-size
La propriété font-size permet de définir la taille du texte de la balise HTML.
Voyons un exemple de la propriété font-size
<h3 style="font-size:200%">Le 200% du balise h3</h3> <p style="font-size:200%">Le 200% du balise p </p>
Résultat :
Le 200% du balise h3
Le 200% du balise p
La propriété text-align
La propriété text-align est utilisée pour définir l’alignement de texte horizontal pour l’élément HTML.
Voyons un exemple de style de balise html avec la propriété css text-align
<h3 style="text-align:right;background-color:pink;">Ceci est placé à droite</h3> <p style="text-align:center;background-color:pink;">Ceci est placé au centre</p>
Résultat :
Ceci est placé à droite
Ceci est placé au centre