ستوضح هذه المشاركة طريقة تحسين إمكانية القراءة باستخدام حجم الخط.
كيفية تحسين إمكانية القراءة باستخدام حجم الخط؟
يمكن زيادة سهولة قراءة الخطوط من خلال العمل على عوامل مختلفة. مثل زيادة طول الخط إلى حجم أكبر قليلاً. بالإضافة إلى ذلك، استخدم عائلة الخطوط المناسبة، واستخدم حجم الخط المناسب. ومع ذلك، لكي تتعلم عمليًا كيفية تحسين سهولة القراءة باستخدام حجم الخط، اتبع الخطوات الواردة أدناه:
الخطوة 1: إنشاء بنية HTML
ابدأ بإنشاء <ديف> مع اسم الفئة ' محتوى '. بعد ذلك، قم بتضمين بعض المحتوى داخل الملف <ديف> بطاقة شعار:
< جسم >
< شعبة فصل = 'محتوى' >
< h1 > مرحبًا بك في تلميح Linux. < / h1 >
< ص > يوفر موقع البوابة الشهير Linux Hint معلومات رائعة حول موضوعات علوم الكمبيوتر. < / ص >
< / شعبة >
< / جسم >
الخطوة 2: تطبيق CSS
أولاً قم بتعيين ' حجم الخط ' ل ' 16 بكسل '' و'ارتفاع الخط' إلى '' 1.5 '. علاوة على ذلك، قم أيضًا بتعيين الخط لـ <ح1> و <ص> العلامات:
جسم {
عائلة الخط: بلا الرقيق؛
الخط- مقاس : 18 بكسل؛
خط- ارتفاع : 1.5 ;
}
h1 {
نص- محاذاة : مركز؛
الخط- مقاس : 26 بكسل؛
}
ص {
الخط- مقاس : 18 بكسل؛
}
انتاج |
إليك مخرجات الكود المناسب لجميع أحجام الشاشات:
الخطوة 3: تطبيق استعلام الوسائط
- أولا اذكر '@يذكر' علامة وتحديد حجم الشاشة ' 768 بكسل ' إلى ' أقصى عرض ' ملكية. سيتم تطبيق حجم الشاشة هذا على جميع الشاشات التي يبلغ حجمها مساويًا أو أقل من ' 768 بكسل '.
- بعد ذلك، قم بتحديد حجم الخط لـ <الجسم> , <ح1> ، و <ص> العلامات:
جسم {
الخط- مقاس : 16 بكسل؛
خط- ارتفاع : 1.5 ;
}
h1 {
الخط- مقاس : 22 بكسل؛
}
ص {
الخط- مقاس : 14
}
}
يوجد أدناه إخراج بعد تطبيق استعلام الوسائط. تم تصميم استعلام الوسائط للأجهزة التي يكون حجم شاشتها يساوي أو أقل من ' 768 بكسل ':
خاتمة
لتحسين إمكانية القراءة من خلال تغيير حجم الخط، عليك أولاً تطوير حس سهولة القراءة وتغيير حجم الخط. علاوة على ذلك، فهم أحجام الخطوط المختلفة وعلامات الخطوط. اختر حجم الخط المناسب ثم اختر ارتفاع الخط المناسب. عادةً ما يكون ارتفاع الخط أكبر بمقدار 1.2 مرة من حجم الخط. علاوة على ذلك، اختر عائلة الخطوط المناسبة لمحتوى الويب. لقد أوضحت هذه المقالة الطريقة العملية لتحسين إمكانية القراءة من خلال تغيير حجم الخط.