עכשיו אפשר להשתמש בכלים למפתחים של Chrome כדי לבדוק באיזה סוג גופן נעשה שימוש להצגת טקסט.
סטאקים של גופנים הם דבר מוזר, יותר הצעה מאשר דרישה. יכול להיות שהמשפחה שתציעו לא תהיה קיימת, ולכן אתם מאפשרים לדפדפן של כל משתמש לטפל במקרה שבו האפשרות הזו לא קיימת, ולשלוף משהו שיפעל ולהשתמש בו.
font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;
כמפתחים, אתם רוצים לדעת באיזה גופן נעשה שימוש. ככה זה עובד:
בקטע סגנונות מחושבים יופיע עכשיו סיכום של הגופנים ששימשו את הרכיב הזה. חשוב לשים לב לכמה דברים:
- בכלים למפתחים מוצג סוג הגופן בפועל שמשמש את שכבת הרינדור של הטקסט ב-Chrome. לא צריך יותר לנחש לאיזה גופן
serif
אוsans-serif
מתבצע בפועל תהליך פתרון. - האם הגופן באינטרנט פועל? לפעמים קשה לדעת אם מוצג גופן האינטרנט או גופן המערכת החלופי. עכשיו אפשר לוודא שהגופן הווירטואלי מיושם. בדוגמה שלמעלה, אנחנו מושכים את Lobster כגופן אינטרנט בסגנון
::first-line
. - קל לזהות גופנים חלופיים בסטאק. למעלה, הייתה שגיאת איות ב-Merriweather ולכן לא נעשה בה שימוש, והיא עברה ל-Lobster.
- האם זה Arial או Helvetica? אפשר לשאול מעצב או… לשאול את כלי הפיתוח. ;)
- הספרייה עובדת מצוין עם Google Webfonts, Typekit, גופנים מקומיים, גופנים מסוג @font-face, גליפים של Unicode וכל מקורות גופנים מעניינים אחרים.
תהנו, ונשמח לקבל מכם משוב.