พร็อพเพอร์ตี้ CSS font-size-adjust จะเข้าสู่ Chrome ในวันนี้
และกลายเป็นส่วนหนึ่งของเกณฑ์ "พร้อมใช้งานใหม่" คุณสมบัตินี้ช่วยป้องกัน
การเปลี่ยนการจัดวางเมื่อโหลดแบบอักษรสำรอง และตรวจสอบว่า
ความอ่านง่ายของแบบอักษรสำรองที่มีขนาดแบบอักษรเล็ก font-size-adjust
พร็อพเพอร์ตี้เป็นส่วนหนึ่งของ
Interop 2024
นี่จึงเป็นชัยชนะอีกครั้งของความพยายาม
ที่จะปรับปรุงความสามารถในการทำงานร่วมกันของ
แพลตฟอร์มเว็บ
ปัญหา
เมื่อคุณเปรียบเทียบแบบอักษร 2 ชุดที่มีขนาดเดียวกัน โดยขึ้นอยู่กับรูปร่างและขนาด ของรูปอักขระ ข้อความที่แสดงอาจใช้พื้นที่ต่างกันมาก ยกตัวอย่างเช่น การสาธิตต่อไปนี้แสดงข้อความใน Verdana และ Arial ตั้งค่าทั้งคู่เป็น 16 พิกเซล
ความแตกต่างของขนาดจะพิจารณาจากข้อเท็จจริงที่ว่ามูลค่าการแสดงผล ความสูงของตัวพิมพ์เล็กเมื่อเปรียบเทียบกับตัวอักษรพิมพ์ใหญ่ในแบบอักษร จะแตกต่างกันไปตามแบบอักษร
กรณีนี้อาจทำให้เกิดปัญหา 2 ข้อเมื่อใช้แบบอักษรที่มีค่าการแสดงผลต่างกัน เป็นตัวเลือกสำรอง อย่างแรก พื้นที่ที่แบบอักษรใช้จะเปลี่ยนแปลง ประการที่สอง แบบอักษรสำรองที่คุณเลือกอาจอ่านได้ไม่ชัดเจนนัก ที่ระบุก่อน โดยเฉพาะที่มีแบบอักษรขนาดเล็ก นั่นเป็นเพราะ ความสูงสัมพัทธ์ของตัวพิมพ์เล็กถึงตัวพิมพ์ใหญ่เป็นปัจจัยสำคัญใน อ่านได้ง่าย
ประโยชน์ของ font-size-adjust
พร็อพเพอร์ตี้ font-size-adjust ช่วยให้คุณปรับแบบอักษรสำรองให้ดีกว่าเดิมได้
ที่ตรงกับแบบอักษรแรก ตัวอย่างต่อไปนี้แสดงแบบอักษร 2 แบบที่แสดง
ก่อนหน้านี้ ครั้งนี้มีการปรับแบบอักษรที่ 2 ให้ตรงกับแบบอักษรแรก
font-size-adjustตัวอย่างนี้ใช้ค่าเดียว นั่นคือตัวเลข ซึ่งจะปรับแบบอักษรโดยใช้
เมตริกแบบอักษรเริ่มต้น ex-height นี่คืออัตราส่วนของ x-height,
ความสูงของตัวพิมพ์เล็ก x ในแบบอักษรจนถึงขนาดแบบอักษร คุณสามารถระบุแบบอักษร
เมตริกที่ใช้ ในตัวอย่างต่อไป ฉันได้ทำให้แบบอักษรเป็นมาตรฐานโดยใช้
คีย์เวิร์ด ch-width คำ นอกเหนือไปจากตัวเลข
font-size-adjust กับเมตริกแบบอักษรที่มีความกว้างระดับ chหากต้องการดูค่าที่เป็นไปได้ทั้งหมด โปรดดู
เอกสาร MDN สำหรับ font-size-adjust
ขอแนะนำให้คุณดูไซต์โดยใช้แบบอักษรสำรอง และดูว่า
ปรับแต่งด้วย font-size-adjust สามารถช่วยผู้อ่านที่ใช้แบบอักษรสำรอง
ได้รับประสบการณ์ ที่ดียิ่งขึ้น โดยเฉพาะตอนนี้พร้อมให้บริการทุกที่