aide Accueil  |  Sommaire CSS  |  Créer sa page perso  |   Menu
www.aidenet.com

C S S
Feuilles de style

Propriété text-indent
pour mise en retrait des paragraphes

Page - 31
w3c et retrait paragraphes


propriété css TEXT-INDENT

 

Retrait du paragraphe avec text-indent

Qui n'a jamais souhaité présenter du texte avec un "zeste" de bon goût et suivant la tradition typographique ? Voici une première possibilité en provoquant un retrait à la première ligne de chaque paragraphe:

Cette propreté"text-indent" bénéficie des règles d'héritage.

A utiliser avec :

Les unités de longueur = l'alinéa a une longueur fixe ;
L'unité de pourcentage = l'alinéa correspond à un pourcentage de la largeur du bloc conteneur.

La valeur de la propriété "text-indent" peut être négative, mais ceci dépend des limites de l'implémentation. Si cette valeur est négative, la valeur de la propriété "overflow" peut avoir une influence sur la visibilité du texte. (overflow = propriété en rapport avec le débordement d'un texte... plus tard)

Commençons ce dossier de mise en forme des paragraphes, par quelques petits exemples qui accompagnés du code source correspondant, valent autant que d'interminables explications.

 

Code dans HEAD de cette page

<STYLE type="text/css">
p
{
font-family: arial, verdana, sans-serif ;
font-size: 10pt ;
color: black ;
background-color: #FFFFFF ;
}

.indent
{ text-indent: 40px ; }


.indentcent
{ text-indent: 15% ; }


</STYLE>

 

Code 1 dans BODY avec "text-indent: 40px"

<p class="indent">*Paris - La d&eacute;route cor&eacute;enne &agrave; l'esprit, ... .</p>

 

Résultat exemple 1

*Paris - La déroute coréenne à l'esprit, le sélectionneur de l'équipe de France, Jacques Santini, a indiqué mardi que le match de gala contre le Brésil n'était pas sa priorité absolue.

*A moins d'un mois de l'entrée des Bleus dans l'Euro 2004 la Fifa, pour son centenaire, a intégré au calendrier cette rencontre de prestige dont la première période sera disputée en tenue d'époque.

*Si les Bleus ne laisseront pas "couler" ce match, selon les termes employés par le sélectionneur, ils n'ont pas l'intention de griller des cartouches avant de s'envoler pour le Portugal.

Paris - La déroute coréenne à l'esprit, le sélectionneur de l'équipe de France, Jacques Santini, a indiqué mardi que le match de gala contre le Brésil n'était pas sa priorité absolue.

 

Explications

Vous pouvez constater que le retrait s'opère sur les trois paragraphes sélectionnés (*) , mais que le quatrième en gras, se présente normalement sans retrait vu qu'aucun code classe n'a été placé par ailleurs.



Code 2 dans BODY avec " text-indent: 15% "

<p class="indentcent"> Maladie courante, souvent banalisée, la grippe peut entraîner,... .</p>

 

Résultat exemple 2

Maladie courante, souvent banalisée, grippe peut entraîner, outre des décès, des complications comme des pneumonies et une fatigue très prolongée chez les adultes, un coma chez les diabétiques, des "états de mal" chez les asthmatiques, voire une insuffisance respiratoire chez les fumeurs...

 

Pourquoi avoir utilisé les Classes ? si vous aviez utilisé le code de retrait applicable au sélecteur "p" vous auriez obtenu ce retrait dans toute la page, ce qui n'était certainement pas votre souhait. Mais c'est réalisable et vous en avez la démonstration page suivante : Cliquez ici pour voir "Retrait dans toute la page".

 

Sommaire CSS ... @ ... Interlignage avec Line-Height

retour vers retrait

Tous droits réservés © 1997 . aidenet.com

validator html