HTML : Ligne horizontale
Lors de la création de pages Web, il peut être utile de séparer différents blocs de contenu pour une meilleure présentation. L'utilisation d'une ligne horizontale peut être un moyen simple et efficace de le faire. Dans ce guide, nous explorerons comment ajouter une ligne horizontale en HTML.
Balise HR
La balise principale pour ajouter une ligne horizontale en HTML est la balise <hr>
. Cette balise ne nécessite pas de balise de fermeture, ce qui la rend simple à utiliser.
Pour ajouter une ligne horizontale, vous pouvez simplement insérer la balise <hr>
à l'endroit où vous souhaitez insérer la ligne. Par défaut, cette balise créera une ligne horizontale pleine largeur, avec une épaisseur de trait de 2 pixels.
<p>Contenu du paragraphe</p>
<hr>
<p>Autre contenu du paragraphe</p>
Attributs de la balise HR
La balise <hr>
prend en charge plusieurs attributs qui permettent de personnaliser l'apparence de la ligne horizontale.
Attribut color
L'attribut color
permet de spécifier la couleur de la ligne horizontale. Vous pouvez utiliser une valeur de couleur nommée ou une valeur hexadécimale pour définir la couleur.
<hr color="red">
Attribut size
L'attribut size
permet de spécifier l'épaisseur de la ligne horizontale. La valeur doit être un entier compris entre 1 et 100.
<hr size="5">
Attribut width
L'attribut width
permet de spécifier la largeur de la ligne horizontale. La valeur doit être un entier compris entre 1 et 100 pourcentage, ou un nombre suivi d'une unité de mesure.
<hr width="50%">
Attribut align
L'attribut align
permet de spécifier l'alignement horizontal de la ligne horizontale. Les valeurs possibles sont left
, center
et right
.
<hr align="center">
Attribut noshade
L'attribut noshade
permet de supprimer l'ombre par défaut de la ligne horizontale.
<hr noshade>
Exemples
Voici quelques exemples de code HTML pour ajouter des lignes horizontales avec différents attributs :
<hr> <!-- Ligne horizontale par défaut -->
<hr color="blue"> <!-- Ligne horizontale bleue -->
<hr size="10"> <!-- Ligne horizontale avec une épaisseur de 10 pixels -->
<hr width="50%"> <!-- Ligne horizontale qui s'étend sur 50% de la largeur de la page -->
<hr align="center"> <!-- Ligne horizontale centrée horizontalement -->
<hr noshade> <!-- Ligne horizontale sans ombre -->
Conclusion
En utilisant la balise <hr>
en HTML, vous pouvez facilement ajouter des lignes horizontales pour améliorer la présentation de votre contenu Web. Les attributs de la balise permettent de personnaliser l'épaisseur, la couleur, la largeur et l'alignement de la ligne horizontale. Avec un peu de créativité, vous pouvez utiliser des lignes horizontales pour diviser efficacement votre contenu et améliorer l'expérience de l'utilisateur.
Sources :
- Mozilla Developer Network (developer.mozilla.org/fr/do...)
- Gilles Hunault (gilles-hunault.leria-info.u...)
- Le codage HTML (broussaille.free.fr/cours/l...)
- ACERFI Formation (formation.acerfi.net/mod/bo...)
- Tutowebdesign (tutowebdesign.com/balise-hr...)
- WikiHow (fr.wikihow.com/ins%C3%A9rer...)
- Netalya (www.netalya.com/fr/html-6.asp)
- Oujood (www.oujood.com/balises/bali...)
aide HTML:Mise en page
www.u-picardie.fr/philippe/...10 - HTML: Ligne Horizontale - YouTube
www.youtube.com/watch?v=Xc9...L'HTML est un langage de programmation qui permet de créer des sites Web. Une des fonctionnalités intéressantes de l'HTML est la possibilité de créer des lignes horizontales pour séparer des sections du site Web. Les lignes horizontales peuvent être facilement implémentées en ajoutant le code suivant à la page HTML :
< hr/>
Vous pouvez également modifier les propriétés de la ligne horizontal. Par exemple, vous pouvez modifier la taille, la couleur et l'épaisseur de la ligne. La syntaxe à utiliser est la suivante :
< hr size = "large" color = "#0000FF" width = "50%" />
En utilisant ce code, vous pouvez créer des lignes horizontales personnalisées selon vos besoins. J'aime personnellement incorporer des lignes horizontales dans mes sites Web car cela permet d'améliorer l'esthétique et la lisibilité du site. Récemment, j'ai créé un site Web pour une entreprise et j'ai utilisé des lignes horizontales de différentes couleurs et tailles pour séparer chaque section du site. Elles ont ajouté une nouvelle dimension esthétique à mon projet et ont eu un impact positif sur le succès du site.