Un ouvre-zine avec une grande initiale baissée ne coûte presque rien : ::first-letter existe exactement pour cela, et il se lit comme un artisanat typographique très cool plutôt que comme une garniture marketing.
.lede::first-letter {
float: left;
font-size: 4rem;
line-height: 0.85;
padding-right: 0.1em;
}Règles appliquées par le navigateur
- La ponctuation précédente rejoint la lettre : un guillemet avant le premier glyphe est inclus par conception, de sorte que le capuchon ne laisse jamais une marque solitaire.
- Peindre, dimensionner, flotter et espacer tous les travaux ; les propriétés affectant la mise en page au-delà de ce désaccord entre les moteurs, alors gardez la recette courte et testez-la une fois.
- L'élément doit être un conteneur de blocs ; sur les éléments en ligne, le pseudo-élément ne s'applique pas, ce qui est un très bel échec car il ne fonctionne jamais à moitié.
La mise à jour de la plateforme à connaître
initial-letter gère le drop et le retrait de manière native, sans flotteurs ; déclarez-le derrière une requête de support et conservez la recette float comme solution de secours, afin que les deux classes de navigateur obtiennent une réponse délibérée au lieu d'un accident.
Une note d'honnêteté pour conclure : les deux recettes sont de la pure peinture, donc les lecteurs d'écran ne sont pas affectés et le balisage reste exactement un paragraphe. Une décoration aussi gacore devrait rester aussi bon marché.