text-indent |
Indentation du texte |
CSS |
|
Syntaxe
Paramètres
Paramètre |
Description |
paramètres |
Ce paramètre de propriété permet d'indiquer l'espacement entre la gauche et le début du paragraphe : |
distance |
Cet attribut permet d'indiquer que l'espacement calculé en pixels. La valeur par défaut est 0. |
pourcentage% |
Cet attribut permet d'indiquer que l'espacement est calculé en fonction du pourcentage de la largeur du document. |
Description
Cette propriété permet de spécifier le déplacement horizontal du corps du paragraphe.
Remarques
- Décalage du texte en début de paragraphe : La propriété text-indent est utilisée pour créer un retrait du texte au début d'un paragraphe. Cela permet
de formater l'apparence du texte de manière esthétique, en particulier pour les textes en blocs ou les articles où un retrait en début de paragraphe est couramment utilisé pour
une meilleure lisibilité.
- Valeur de la propriété : text-indent accepte des valeurs spécifiques en unités de longueur (comme px, em, rem, %) ou un nombre positif ou négatif. Par
exemple, text-indent: 20px appliquera un retrait de 20 pixels au début du paragraphe. Les valeurs négatives peuvent également être utilisées pour ajuster l'alignement
du texte d'une manière non conventionnelle, par exemple pour créer un effet visuel particulier.
- Effet sur tous les paragraphes : Lorsqu'appliquée à un élément de type bloc, tel qu'un paragraphe (<p>), la propriété
text-indent affecte l'ensemble du texte contenu dans cet élément. Cela signifie que tout le texte du paragraphe sera décalé de la même manière, ce qui permet d'assurer
une présentation uniforme du texte.
- Comportement avec des listes : La propriété text-indent peut également être utilisée pour ajuster l'indentation dans les listes. Par exemple, en appliquant
un retrait sur un élément <li>, vous pouvez influencer l'alignement des puces ou des numéros par rapport au texte. Cela permet de
personnaliser davantage l'apparence des listes, notamment pour les listes imbriquées.
- Combinaison avec d'autres propriétés de mise en page : text-indent est souvent combinée avec d'autres propriétés CSS telles que
line-height, margin, ou padding pour ajuster l'espacement et la mise en
forme du texte. Par exemple, un retrait appliqué en combinaison avec un espacement de ligne plus large peut améliorer la lisibilité et l'apparence du texte dans de longues
sections de contenu.
- Utilisation dans la typographie traditionnelle : Traditionnellement, les livres et les articles utilisent des retraits au début des paragraphes pour séparer
visuellement les idées ou les sections du texte. En CSS, text-indent permet de reproduire cet effet typographique en appliquant un retrait cohérent à tous les paragraphes,
ce qui aide à structurer le texte de manière professionnelle.
- Indépendance du contenu : text-indent ne modifie pas le flux ou la structure globale du contenu. Le retrait s'applique uniquement à l'affichage visuel
du texte au sein du bloc, sans affecter le positionnement d'autres éléments ou les marges extérieures de l'élément. Cela permet de garder une disposition propre et ordonnée.
- Prise en charge dans les navigateurs modernes : text-indent est largement pris en charge par tous les navigateurs modernes. Cependant, il est important
de vérifier son comportement dans les anciennes versions d'Internet Explorer si vous ciblez des navigateurs plus anciens.
Dans la plupart des cas, cette propriété est stable et fiable, permettant une utilisation efficace dans la mise en forme du texte.
Dernière mise à jour : Dimanche, le 20 décembre 2015