Paul Irish
ตอนนี้ Chrome DevTools สามารถบอกคุณชุดแบบอักษรที่ใช้ในการแสดงผลข้อความได้
การจัดเรียงแบบเป็นกองของแบบอักษรเป็นเรื่องที่น่าสนใจ เพราะเป็นคำแนะนำมากกว่าความต้องการ เนื่องจากครอบครัวที่คุณแนะนำอาจไม่มีอยู่ คุณจะอนุญาตให้เบราว์เซอร์ของผู้ใช้แต่ละรายจัดการกรณีตกหล่น ดึงสิ่งที่ได้ผลและใช้ได้
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 typefaces, รูปอักขระ Unicode และแหล่งแบบอักษรที่น่าสนใจอื่นๆ
โปรดแสดงความคิดเห็นหากมี