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

Paul Irish

Narzędzie deweloperskie w Chrome może powiedzieć, jaki dokładnie krój czcionki jest używany do renderowania tekstu.

Zestawy czcionek to zabawna rzecz, bardziej sugestia niż wymóg. 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 programista chcesz wiedzieć, jakiego fontu używa się w rzeczywistości. 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 podają rzeczywisty krój czcionki używany przez warstwę renderowania tekstu w Chrome. Nie musisz już zgadywać, do której czcionki serif lub sans-serif jest faktycznie rozwiązywane.
• Czy mój czcionka internetowa działa? Czasami trudno stwierdzić, czy widzisz czcionkę internetową, czy 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 słowa Merriweather, więc nie został ono użyte, a zamiast tego pojawiło się 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.

Jeśli chcesz podzielić się z nami opinią, zostaw komentarz.