La typographie et la mise en forme de caractères
CHAPITRE 5
79
On peut cumuler toutes ces fonctionnalités de décoration du texte, en précisant plusieurs valeurs à la propriété text-decoration. Le code suivant produira ainsi un titre
souligné et surligné :
On recourt très fréquemment à la propriété text-decoration pour modifier le soulignement des liens hypertextes. Ainsi, pour mettre en place des liens soulignés uniquement lors de leur survol par le pointeur de la souris, on pourra écrire :
La casse : minuscules et majuscules
La casse est la prise en compte des majuscules et des minuscules des caractères. Elle
se traduit en CSS par la propriété héritée text-transform, qui admet quatre valeurs :
• capitalize : seule la première lettre de chaque mot du texte sera affichée en
majuscule.
• lowercase : tout le texte sera affiché en minuscules.
• uppercase : tout le texte sera affiché en majuscules.
• none : le texte ne sera pas modifié.
Seul l’affichage des caractères sera ainsi modifié, le texte du document source restant
inchangé. Exemple :
h1 {
text-decoration: underline overline;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
HÉRITAGE Remise à zéro d'une valeur
La valeur none permet d’annuler un effet text-transform appliqué à un ancêtre de l’élément considéré. Cette propriété est en effet héritée par les descendants de tout élément sur lequel elle porte.
CSS
.majuscules {
text-transform: uppercase;
}
CHAPITRE 5
79
On peut cumuler toutes ces fonctionnalités de décoration du texte, en précisant plusieurs valeurs à la propriété text-decoration. Le code suivant produira ainsi un titre
souligné et surligné :
On recourt très fréquemment à la propriété text-decoration pour modifier le soulignement des liens hypertextes. Ainsi, pour mettre en place des liens soulignés uniquement lors de leur survol par le pointeur de la souris, on pourra écrire :
La casse : minuscules et majuscules
La casse est la prise en compte des majuscules et des minuscules des caractères. Elle
se traduit en CSS par la propriété héritée text-transform, qui admet quatre valeurs :
• capitalize : seule la première lettre de chaque mot du texte sera affichée en
majuscule.
• lowercase : tout le texte sera affiché en minuscules.
• uppercase : tout le texte sera affiché en majuscules.
• none : le texte ne sera pas modifié.
Seul l’affichage des caractères sera ainsi modifié, le texte du document source restant
inchangé. Exemple :
h1 {
text-decoration: underline overline;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
HÉRITAGE Remise à zéro d'une valeur
La valeur none permet d’annuler un effet text-transform appliqué à un ancêtre de l’élément considéré. Cette propriété est en effet héritée par les descendants de tout élément sur lequel elle porte.
CSS
.majuscules {
text-transform: uppercase;
}
