Paul Irish
Chrome DevTools kini dapat memberi tahu Anda jenis typeface yang digunakan untuk merender teks.
Stack font adalah hal yang lucu, lebih merupakan saran daripada permintaan. Karena keluarga yang Anda sarankan mungkin tidak ada, Anda mengizinkan browser setiap pengguna menangani kasus penerusan, mengambil sesuatu yang akan berfungsi, dan menggunakannya.
font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", serif;
Sebagai developer, Anda ingin mengetahui font yang sebenarnya digunakan. Berikut caranya:
Di bagian Gaya yang Dihitung, Anda sekarang akan melihat ringkasan typeface yang digunakan untuk elemen tersebut. Ada beberapa hal yang perlu diperhatikan di sini:
- DevTools melaporkan typeface sebenarnya yang digunakan oleh lapisan rendering teks Chrome. Tidak perlu lagi menebak font mana yang sebenarnya di-resolve oleh
serifatausans-serif. - Apakah font web saya berfungsi? Terkadang sulit untuk mengetahui apakah Anda melihat webfont atau font sistem penggantian. Sekarang Anda dapat memverifikasi bahwa webfont diterapkan. Pada contoh di atas, kita menarik Lobster sebagai font web untuk gaya
::first-line. - Font yang terlihat jelas di kelompok pengguna mudah ditemukan. Di atas, kami memiliki kesalahan ketik dengan ejaan Merriweather sehingga tidak digunakan, hingga gagal masuk ke Lobster.
- Apakah itu Arial atau Helvetica? Tanyakan kepada desainer atau… tanyakan kepada DevTools. ;)
- Berfungsi dengan baik dengan Google Webfonts, Typekit, font lokal, typeface @font-face, glyph unicode, dan semua sumber font menarik lainnya.
Selamat menikmati dan berikan komentar jika Anda memiliki masukan.