ในเดือนพฤษภาคม Microsoft ได้จัดเตรียมฟอนต์ Yahei อย่างเป็นทางการให้ดาวน์โหลดภายใต้ Windows XP แบบอักษร Yahei เป็นแบบอักษรที่เกือบจะสมบูรณ์แบบซึ่งช่วยแก้ปัญหาตัวอักษรสไตล์เพลงขนาดเล็กที่อ่านไม่ออก โดยเฉพาะอย่างยิ่งสำหรับจอแสดงผลคริสตัลเหลว (LCD) หลังจากเปิดเอฟเฟกต์ ClearType คุณจะได้รับความบันเทิงทางภาพที่สมบูรณ์แบบยิ่งขึ้น ตอนนี้ฉันรู้สึกทึ่งกับ Yahei เมื่อมองย้อนกลับไปที่ระบบที่มีค่าเริ่มต้นเป็นราชวงศ์ซ่ง ขอบหยักนั้นชัดเจนและน่าเกลียดเกินไป
แต่ปัญหาที่มาพร้อมกับสิ่งนี้ก็คือ แบบอักษร Yahei จะมีผลกระทบต่อความคลาดเคลื่อนในการแสดงเค้าโครงหน้าเว็บใน Internet Explorer ปัญหาที่ฉันพบจนถึงตอนนี้ส่วนใหญ่มีอยู่สองด้าน
1. บางครั้งการขีดเส้นใต้อาจกลายเป็นเส้นขีดทับ
อันที่จริง นี่เป็นภาพที่ไม่ตรงและไม่ใช่เส้นขีดทับที่แท้จริง ในย่อหน้าที่มีภาษาอังกฤษผสมและภาษาจีน เส้นใต้จะขาดและค่อนข้างไม่ปกติ
ต่อไปนี้เป็นไฮเปอร์ลิงก์ข้อความภาษาจีนที่หน้าแรกของ google.cn:
ปรากฏการณ์นี้ปรากฏในแบบอักษรภาษาจีนเท่านั้น แบบอักษรภาษาอังกฤษจะไม่ได้รับผลกระทบ:
จะชัดเจนยิ่งขึ้นหากมีภาษาจีนและอังกฤษผสมกัน:
จะเห็นได้ว่าขีดเส้นใต้ถูกเลื่อนขึ้นด้านบนทุกที่ที่มีตัวอักษรจีน และภาษาอังกฤษไม่ได้รับผลกระทบ
2. ความสูงของบรรทัดเปลี่ยนแปลงใน Internet Explorer
ต่อไปนี้เป็นภาพหน้าจอของไฮเปอร์ลิงก์ที่มีภาพพื้นหลังในบล็อกของฉัน:
ขณะนี้รูปแบบปกติดั้งเดิมภายใต้แบบอักษรเพลงปรากฏอยู่ด้านล่าง ซึ่งแสดงว่าความสูงของบรรทัดได้เพิ่มขึ้นใน Internet Explorer แต่ใน Firefox ไม่มีอะไรเปลี่ยนแปลง
3. พยายามแก้ไขปัญหา
ในภาพหน้าจอของ Google.cn เราพบว่าไฮเปอร์ลิงก์ "เข้าสู่ระบบ" ทางด้านขวาเป็นเรื่องปกติ นี่แสดงว่าไม่ใช่ทุกไฮเปอร์ลิงก์ของจีนที่มีปัญหานี้ ฉันพบว่าลิงก์ทางด้านซ้ายมีสไตล์ที่พิเศษกว่า "เข้าสู่ระบบ" ทางด้านขวา:
Vertical-align:top;
หลังจากที่ฉันบล็อกแอตทริบิวต์นี้ ทุกอย่างเป็นไปด้วยดี ในภาพหน้าจอที่สามจาก "ฟอรัม Meizu" ฉันพบว่าแม้ว่าการจัดแนวตั้งจะไม่ปรากฏในข้อความ แต่ก็มีภาพเล็ก ๆ สองภาพต่อไปนี้:
แนวตั้ง: กลาง;
ลบสองภาพนี้ในภายหลัง ทุกอย่างก็กลับมาเป็นปกติอีกครั้ง
ดังนั้นจึงมั่นใจได้ว่าจะมีปัญหาในการใช้การจัดแนวแนวตั้งในไฮเปอร์ลิงก์ภาษาจีน (ไม่ใช่ทุกองค์ประกอบที่มีแอตทริบิวต์การจัดแนวแนวตั้ง) วิธีแก้ไขที่ง่ายที่สุดคือหลีกเลี่ยงการใช้การจัดแนวแนวตั้งหรือการจัดแนว valign หรือหลีกเลี่ยงการใช้ซูเปอร์ลิงก์ที่ขีดเส้นใต้ แน่นอนว่านี่ไม่ใช่วิธีที่ดีในการจัดการกับปัญหาอย่างถูกต้อง
สำหรับปัญหาที่เกิดขึ้นในบล็อกของฉัน มันแสดงให้เห็นว่าแบบอักษร Yahei ทำให้ความสูงของบรรทัดเพิ่มขึ้นใน Internet Explorer (Firefox จะแสดงตามปกติ) ปัญหา คุณเพียงแค่ต้องควบคุมความสูง แต่ มันเป็นองค์ประกอบแบบอินไลน์และไม่สามารถตั้งค่าความสูงได้ ดังนั้นคุณต้องร่วมมือกับ disaply:block แล้วแก้ไขความสูง (อย่างไรก็ตาม หลังจากตั้งค่าแอตทริบิวต์ block แล้ว การตัดบรรทัดอัตโนมัติ อาจเกิดขึ้นได้ ในกรณีนี้ คุณต้องใช้ float และคุณสมบัติอื่นๆ ร่วมกัน) ฉันพบว่าวิธีนี้สามารถแก้ปัญหาข้างต้นได้ ดังนั้นการกำหนดความสูงของไฮเปอร์ลิงก์จึงเป็นวิธีที่ดีกว่า
หมายเหตุเพิ่มเติม: ฉันแก้ไขแบบอักษรเริ่มต้นโดยใช้ Windows XP ซึ่งอาจทำให้เกิดปัญหาบางอย่างได้ เป็นการยากสำหรับฉันที่จะระบุได้ว่าปัญหาสองประเภทที่ฉันระบุไว้ข้างต้นนั้นเกิดจากแบบอักษร Yahei เองหรือการตั้งค่าที่ไม่ถูกต้องอื่น ๆ . ฉันไม่สามารถทราบได้ว่ามีปัญหานี้ในการทดสอบระบบ Vista หรือไม่ หากใครมีเงื่อนไขคุณสามารถช่วยทดสอบได้
หมายเหตุ: ปัญหานี้เกิดขึ้นใน Internet Explorer ทุกเวอร์ชัน Firefox จะไม่ได้รับผลกระทบ