Odpowiedzi na pytania w Narzędziach deweloperskich – co to za czcionka?

Paul Irish

Narzędzia deweloperskie w Chrome mogą teraz informować dokładnie, jaki krój czcionki jest używany do renderowania tekstu.

Stosy czcionek to zabawna rzecz, która raczej stanowi sugestię niż żądanie. Proponowana przez Ciebie rodzina może nie być obecna, więc przeglądarka każdego użytkownika będzie mogła obsłużyć przypadek awaryjny, pobierając coś, co będzie działać.

font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;

Jako deweloper chcesz się dowiedzieć, jaka czcionka jest faktycznie używana. Jak to działa:

W sekcji Obliczone style zobaczysz podsumowanie czcionek użytych w tym elemencie. Należy zwrócić uwagę na kilka kwestii:

• Narzędzia deweloperskie zgłaszają rzeczywisty krój czcionki używany w warstwie renderowania tekstu w Chrome. Nie musisz już zgadywać, która czcionka jest przeznaczona dla pliku serif lub sans-serif.
• Czy mój czcionka internetowa działa? Czasami trudno jest określić, czy widzisz czcionkę internetową czy zastępczą czcionkę systemową. Teraz możesz sprawdzić, czy czcionka internetowa jest stosowana. W tym przykładzie pobieramy czcionkę internetową Lobster w stylu ::first-line.
• Czcionki zastępcze w grupie są łatwe do zauważenia. W powyższym przykładzie wystąpił błąd w pisowni Merriweather, więc nie został on użyty, a wybrano Lobster.
• Czy to Arial czy Helvetica? Zapytaj projektanta lub… skorzystaj z Narzędzi deweloperskich. ;)
• Doskonale współpracuje z czcionkami internetowymi Google, Typekit, lokalnymi czcionkami, krojami czcionek @font-face, znakami Unicode i wszystkimi innymi interesującymi źródłami czcionek.

Życzymy dobrej zabawy i zachęcam do komentowania.