Paul Irish
Chrome DevTools kan u nu precies vertellen welk lettertype wordt gebruikt om tekst weer te geven .
Lettertypestapels zijn grappig, meer een suggestie dan een eis. Omdat de door u voorgestelde familie mogelijk niet aanwezig is, laat u de browser van elke gebruiker de fall-through-zaak afhandelen, iets uithalen dat werkt en dat gebruiken.
font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;
Als ontwikkelaar wil je weten welk lettertype daadwerkelijk wordt gebruikt . Dit is hoe het werkt:
Onder Computed Styles ziet u nu een samenvatting van de lettertype(n) die voor dat element zijn gebruikt. Er zijn een paar dingen om op te merken:
- DevTools rapporteert het daadwerkelijke lettertype dat wordt gebruikt door de tekstweergavelaag van Chrome. U hoeft niet meer te raden naar welk lettertype
serifofsans-serifhet eigenlijk gaat. - Werkt mijn webfont? Soms is het moeilijk te bepalen of u het webfont of het fallback-systeemlettertype ziet. Nu kunt u verifiëren dat het webfont wordt toegepast . In het bovenstaande voorbeeld halen we Lobster naar beneden als een weblettertype voor de
::first-line. - Doorvallende lettertypen in uw stapel zijn gemakkelijk te herkennen . Hierboven hadden we een typefout in de spelling Merriweather en deze werd daarom niet gebruikt en ging door naar Lobster.
- Is dat Arial of Helvetica? Vraag het aan een ontwerper of... vraag het aan DevTools. ;)
- Werkt prima met Google Webfonts, Typekit, lokale lettertypen, @font-face-lettertypen, Unicode-glyphs en alle andere interessante lettertypebronnen.
Geniet ervan en laat een reactie achter als je feedback hebt.