Lettrines
CHAPITRE 10
145
Cette méthode a l’inconvénient d’imposer au rédacteur de spécifier manuellement la
portée de la lettrine. C’est aussi une balise dépourvue de sémantique, méthode à proscrire dans un design bien structuré. Malgré tout, c’est une solution de contournement
nécessaire pour obtenir certains effets impossibles avec la technique :first-letter.
Les exemples de la figure 10-5 inspireront la créativité du lecteur. Ils recourent tous
deux à la technique de la balise .
C’est le code suivant qui a permis d’obtenir un tel résultat :
CSS
.lettrine {
float: left;
font: bold 3em/1em Georgia, Times New Roman, Times, serif;
color: #900;
border: 1px solid #900;
background-color: #ffc;
margin-right: 3px;
padding: 1px;
}
Figure 10–4
Une lettrine graphique
Figure 10–5
Exemples de lettrines
graphiques
HTML

Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Pellentesque laoreet feugiat massa. Etiam
vitae massa. Vivamus aliquam aliquam pede. Suspendisse rutrum
sollicitudin metus