แท็ก:

< ร่างกาย >
< กอง ระดับ = 'เนื้อหา' >
< h1 > ยินดีต้อนรับสู่คำแนะนำ Linux < / h1 >
< พี > เว็บไซต์พอร์ทัลยอดนิยม Linux Hint กำลังให้ข้อมูลที่ดีเยี่ยมเกี่ยวกับหัวข้อวิทยาการคอมพิวเตอร์ < / พี >
< / กอง >
< / ร่างกาย >

ขั้นตอนที่ 2: ใช้ CSS
ขั้นแรก ให้ตั้งค่า “ ขนาดตัวอักษร ' ถึง ' 16px ” และ “ความสูงของเส้น” ถึง “ 1.5 '. นอกจากนี้ยังกำหนดแบบอักษรสำหรับ

และ

แท็ก:

ร่างกาย {
ตระกูลฟอนต์: sans-serif;
แบบอักษร- ขนาด : 18px;
เส้น- ความสูง : : 1.5 ;
}

h1 {
ข้อความ- จัดตำแหน่ง : ศูนย์;
แบบอักษร- ขนาด : 26px;
}

พี {
แบบอักษร- ขนาด : 18px;
}

เอาท์พุต
นี่คือผลลัพธ์ของโค้ดที่เหมาะกับหน้าจอทุกขนาด:

---

---

ขั้นตอนที่ 3: ใช้ Media Query

• ก่อนอื่นให้พูดถึง '@กล่าวถึง' แท็กและระบุขนาดหน้าจอ “ 768px ” ถึง “ ความกว้างสูงสุด ' คุณสมบัติ. ขนาดหน้าจอนี้จะใช้กับทุกหน้าจอที่มีขนาดเท่ากับหรือน้อยกว่า “ 768px '.
• หลังจากนั้นให้ระบุขนาดตัวอักษรสำหรับ <ร่างกาย> ,

  , และ

  แท็ก:

@ สื่อ ( สูงสุด- ความกว้าง : 768px ) {
ร่างกาย {
แบบอักษร- ขนาด : 16px;
เส้น- ความสูง : : 1.5 ;
}

h1 {
แบบอักษร- ขนาด : 22px;
}

พี {
แบบอักษร- ขนาด : : 14
}
}

ด้านล่างนี้เป็นผลลัพธ์หลังจากใช้คิวรีสื่อ แบบสอบถามสื่อได้รับการออกแบบสำหรับอุปกรณ์ที่มีขนาดหน้าจอเท่ากับหรือน้อยกว่า “ 768px ”:

บทสรุป

เพื่อเพิ่มความสามารถในการอ่านด้วยขนาดฟอนต์ ขั้นแรก ให้พัฒนาความรู้สึกของความสามารถในการอ่านและขนาดฟอนต์ นอกจากนี้ ทำความเข้าใจขนาดฟอนต์และแท็กฟอนต์ต่างๆ เลือกขนาดตัวอักษรที่เหมาะสมแล้วเลือกความสูงของบรรทัดที่เหมาะสม โดยทั่วไปแล้ว ความสูงของบรรทัดจะเป็น 1.2 เท่าของขนาดตัวอักษร นอกจากนี้ ให้เลือกตระกูลฟอนต์ที่เหมาะกับเนื้อหาเว็บ บทความนี้ได้สาธิตวิธีปฏิบัติในการเพิ่มขนาดตัวอักษรให้อ่านง่าย