โดยปกติแล้วรูปแบบของหน้าเว็บที่เห็นจะถูกควบคุมโดยสามเลเยอร์ เช่นเดียวกับ CSS ลำดับความสำคัญเบื้องหลังนั้นสูงกว่ารุ่นก่อนหน้าซึ่งหมายความว่ารูปแบบการกำหนดหน้าเว็บสามารถแทนที่สไตล์เริ่มต้นของเบราว์เซอร์ในขณะที่สไตล์ที่ผู้ใช้กำหนดมีความสำคัญสูงสุด สถานการณ์จริงคือแม้ว่าเบราว์เซอร์จะให้ฟังก์ชั่นสไตล์ที่ผู้ใช้กำหนดมากขึ้นหรือน้อยลง แต่ผู้ใช้น้อยมากจะปรับแต่งได้และโดยทั่วไปจะใช้เป็นผู้ใช้ขั้นสูง รูปแบบเริ่มต้นของเบราว์เซอร์มักจะแตกต่างกันในเบราว์เซอร์ที่แตกต่างกันเวอร์ชันภาษาที่แตกต่างกันและแม้แต่รุ่นระบบที่แตกต่างกัน ในการพยายามเขียนการตั้งค่าเริ่มต้นของเบราว์เซอร์เพื่อให้แน่ใจว่าสไตล์ของเบราว์เซอร์แต่ละตัว
ใช้แบบอักษรเป็นตัวอย่าง แบบนี้. ดังนั้นเราจำเป็นต้องตั้งค่าสไตล์ตัวอักษรเริ่มต้นอย่างสม่ำเสมอเพื่อให้ได้เอฟเฟกต์การแสดงผลที่สอดคล้องกันเพื่อให้แน่ใจว่าการออกแบบที่สอดคล้องกันและปรับปรุงประสิทธิภาพการพัฒนา
ในอนาคตเตรียมที่จะใช้รูปแบบตัวอักษรเริ่มต้นต่อไปนี้:
ร่างกาย{ แบบอักษร: 12px/1.5 Arial; -
ตัวละครส่วนใหญ่ในหน้าของเราเป็นภาษาจีน & คัดลอก; โดยทั่วไปเราคาดว่าจะใช้ CSS เพื่อแสดงในรูปแบบตัวอักษรที่ดีขึ้นจากนั้นใช้ตัวอักษรเพลงเพื่อแสดงสัญลักษณ์จีนและจีน เหตุผลที่ฉันเลือก Arial ก็เป็นเพราะ:
ทั้ง Windows และ Mac มีตัวอักษรที่ติดตั้งไว้ล่วงหน้าซึ่งควรเป็นแบบอักษรเว็บที่ใช้กันอย่างแพร่หลายมากที่สุด คู่แข่งที่มีศักยภาพ tahoma
และ helvetica
นั้นไม่โชคดีนัก
ผู้เชี่ยวชาญด้านการออกแบบภาพอาจคิดว่าการใช้ Tahoma ใน Windows และ Helvetica ใน Mac font: 12px/1 Tahoma, Helvetica, Arial, "5b8b4f53", sans-serif;
ดีกว่า font: 12px/1 Tahoma, Helvetica, Arial, "5b8b4f53", sans-serif;
นี่เป็นตัวเลือกที่ยอดเยี่ยม แต่คุณจะพบว่า Google เวอร์ชันใหม่, Yahoo, YouTube, Bing และแม้แต่ MSN ใช้ arial
เป็นตัวอักษรเริ่มต้นแรก ดังนั้นในแง่ของความสวยงามและความสามารถในการอ่าน arial
ควรเป็นที่ยอมรับได้อย่างสมบูรณ์
โดยทั่วไปแล้วการตั้งค่าตัวอักษรครอบครัวจะตั้งค่าครอบครัวแบบ font-family:arial,sans-serif;
ทั่วไปในตอนท้ายเพื่อให้แน่ใจว่าการรักษาความปลอดภัย การเข้ารหัสคือ GBK, IE8 จะทำให้ฟอนต์เพลงเนื่องจาก sans-serif
sans-serif
เกิดการเสียรูปแบบของแบบอักษร
เนื่องจากตัวเลือกของแบบอักษรจีนมี จำกัด มากเบราว์เซอร์กระแสหลักทั้งหมดจึงตั้งค่าให้ใช้ตัวอักษรเพลงเพื่อแสดงภาษาจีน หน้าแรกของ Baidu และผลการค้นหาใช้ font-family:arial;
ความปลอดภัยของการทำสิ่งนี้สามารถอธิบายได้จากด้านข้าง บางคนอาจสังเกตเห็นว่าแบบอักษรจีนที่แสดงโดย Firefox จีนคือ Microsoft Yahei นอกจากนี้ยังเกิดจากสถานการณ์ที่คล้ายกันซึ่งเป็นสิ่งสำคัญมากสำหรับเราในการออกแบบหน้าเว็บอย่างยืดหยุ่น
หนึ่งในปัญหาที่จะนำไปสู่การใช้แบบอักษรภาษาอังกฤษเป็นแบบอักษรเริ่มต้นแรกคือปัญหาการจัดตำแหน่งในภาษาจีนและภาษาอังกฤษและการผสมสัญลักษณ์ หากคุณเปลี่ยนแบบอักษรก็สามารถแก้ปัญหาได้อย่างสมบูรณ์ เห็นได้ชัดว่าปัญหานี้เกิดขึ้นใน IE เท่านั้น ดังนั้นหากเว็บไซต์ของคุณไม่ค่อยใช้ภาษาอังกฤษตัวเลขและสัญลักษณ์ภาษาอังกฤษมันก็เป็นตัวเลือกที่สมเหตุสมผลในการตั้งค่า {font-family:5b8b4f53;}
โดยตรง
12px เป็นขีด จำกัด ของการแสดงผลของ Songtung เนื่องจากฟอนต์เพลงเป็นแบบอักษรเว็บสากลเพียงตัวเดียวที่แสดงภาษาจีนในปัจจุบัน 12PX จึงกลายเป็นขนาดตัวอักษรที่ใช้กันมากที่สุด แน่นอนเราสามารถปรับเปลี่ยนค่าเริ่มต้นนี้ตามความต้องการของผลิตภัณฑ์
ไม่จำเป็นต้องพิจารณาการออกแบบตามขนาดตัวอักษร (EM)
ในเวอร์ชันภาษาจีนหลังจาก Chrome 3.0 ขนาดตัวอักษรขั้นต่ำคือ 12px
นี่คือค่าประสบการณ์ ตัวอย่างเช่นในแบบอักษรของ Yui มันเป็น font:13px/1.231 arial,helvetica,clean,sans-serif;
คือ 1.231 เท่าของแบบอักษรเริ่มต้น สำหรับภาษาจีนขนาดตัวอักษรที่ใช้กันทั่วไปเช่น 12px, 14px, 16px, 18px ฯลฯ การตั้งค่าความสูงของเส้นเป็นจำนวนคู่ใน IE6 และ IE7 ยังสามารถแก้ปัญหาของแบบอักษรในบางกรณีพิเศษ
ใน IE6 และ IE7 ค่าสูงของบรรทัดจะต้องมากกว่า 2px ของแบบอักษรเพื่อให้แน่ใจว่าการแสดงแบบอักษรที่สมบูรณ์หรือเพื่อแสดงขีดล่างอย่างมีประสิทธิภาพเมื่อเป็นลิงค์
เมื่อการตั้งค่า line-height
ระวังไม่ให้ใช้หน่วย (รวมถึง %) เนื่องจากโหนดเด็กจะสืบทอดค่าความ line-height
ของบรรทัดที่คำนวณได้ โดยไม่ต้องเปลี่ยนด้วยขนาดตัวอักษรและค่าที่ไม่มีหน่วยเป็นหลาย font-size
ของคอนเทนเนอร์ดังนั้นการตั้งค่าเป็นค่าที่ไม่มีหน่วยเป็นตัวเลือกที่ดีที่สุด
ความสูงของเส้น CSS ในเชิงลึกมีประโยชน์มากสำหรับการทำความเข้าใจ line-height
และคุ้มค่าที่จะอ่าน
แพลตฟอร์มส่วนใหญ่มี arial
ซึ่งช่วยลดเวลาการค้นหาของเบราว์เซอร์
รหัสน้อยที่สุดและเขียนง่าย arial
เป็นแบบอักษรที่มีชื่อที่สั้นที่สุดซึ่งสามารถบันทึกขนาดของ CSS
ตัวอักษรทั้งหมดเป็นตัวพิมพ์เล็กและ Google ทำสิ่งนี้ในปัจจุบันด้วยข้อได้เปรียบที่สามารถเขียนได้เร็วขึ้นและปรับปรุงประสิทธิภาพของการบีบอัด GZIP
เป็นการดีที่สุด {font-family:5fae8f6f96c59ed1;}
จะใช้ {font-family:5b8b4f53;}
เพื่อแสดงเป็นภาษาจีน . ประโยชน์นี้คือการหลีกเลี่ยงการเข้ารหัส
ใช้ประเภทตัวอักษรที่ถูกต้องในการเขียนหลีกเลี่ยงเครื่องหมายใบเสนอราคาซึ่งสามารถลดขนาดของ CSS ได้ แบบอักษรจีนสามารถเขียนด้วยวิธีก่อนหน้า
จากการทดสอบการจัดเรียงแบบผสมของภาษาจีนและภาษาอังกฤษและสัญลักษณ์ฉันพบว่า Microsoft Yahei ทำได้ค่อนข้างดีรวมถึงหมายเลขภาษาอังกฤษและตัวละครภาษาอังกฤษรวมถึงเอฟเฟกต์การแสดงผลของ IE6 และ IE7 แต่สิ่งเดียวที่เสียใจคือถ้า Microsoft Yahe ถูกติดตั้งภายใต้ XP หากผู้ใช้ที่มีฟอนต์สีดำไม่เปิดตัวเลือก "ขอบแบบอักษรที่เรียบของหน้าจอ" มันจะเบลอและยากที่จะรับรู้ภายใต้ Firefox, Safari, Opera และโดยเฉพาะอย่างยิ่ง IE6 ขณะนี้ไม่มีทางออกที่ดีสำหรับปัญหานี้ดังนั้นจึงเป็นไปได้ที่จะใช้อย่างเป็นทางการจนกว่าอัตราส่วนการใช้งาน IE6 จะเล็กมาก อาจจะใช้เวลาจนถึงปี 2014 เมื่อ XP ตาย
แม้ว่า @font-face จะถูกพบเร็วมาก แต่การสนับสนุนของเบราว์เซอร์ความเร็วเครือข่ายและปัญหาทางธุรกิจก็ไม่ค่อยมีการใช้ ข่าวดีเกี่ยวกับฟอนต์เมื่อเร็ว ๆ นี้คือ Firefox 3.6 จะสนับสนุน Web Open Font Forma สำหรับข้อมูลที่เกี่ยวข้องเกี่ยวกับอนาคตของเว็บอักษรคุณสามารถเห็นอนาคตของแบบอักษรเว็บเกี่ยวกับตัวอักษรเว็บ: สถานการณ์ปัจจุบันและอนาคตและพูดคุยเกี่ยวกับสถานการณ์ปัจจุบันและอนาคตของเว็บอักษร