يعد حجم الخط التكيفي أحد الجوانب المهمة عند إنشاء صفحات ويب سريعة الاستجابة. يسمح لك بتغيير حجم الخط تلقائيا اعتمادا على حجم شاشة جهاز المستخدم ، مما يضمن سهولة قراءة النص المثلى على جميع الأجهزة.
بوتستراب ، واحدة من الأطر كس الأكثر شعبية ، ويوفر أدوات لخلق حجم الخط التكيف. ويستخدم وحدات "ريم" و " إم " لتحديد حجم الخط ، والتي يتم تحجيمها اعتمادا على العنصر الأصل.
لاستخدام حجم الخط التكيفي في التمهيد ، يجب إضافة الفئة المناسبة إلى العنصر الذي تريد تطبيق حجم الخط التكيفي عليه. على سبيل المثال ، تقوم فئة" العرض -4 "بتعيين حجم الخط إلى 2.5 ريم لعناوين المستوى الأول ، وتقوم فئة" الرصاص " بتعيين حجم الخط إلى 1.25 ريم للنص الرئيسي.
باستخدام التكيف حجم الخط في التمهيد يسمح للمطورين لخلق محتوى أكثر مرونة وقابلة للقراءة التي تتكيف بسهولة إلى الأجهزة المختلفة ، ويدعم تجربة أفضل للمستخدم.
- ما هو حجم الخط التكيفي?
- الخطوة 1: اتصال التمهيد
- الخطوة 2: استخدام فئة' العرض-1'
- الخطوة 3: باستخدام وحدة القياس 'ريم'
- مزايا حجم الخط التكيفي
ما هو حجم الخط التكيفي?
يعتمد التخطيط بحجم الخط التكيفي على استخدام وحدات القياس النسبية ، مثل النسب المئوية ( ٪ ) أو إم أو ريم. بدلا من تحديد القيمة المطلقة لحجم الخط المستخدم في عناصر هتمل ، نقوم بتعريفه بالنسبة للعنصر الأصل أو حجم الخط الأساسي في الصفحة.
يسمح هذا للنص بالتكيف مع درجات الدقة وأحجام الشاشة المختلفة. على سبيل المثال ، على جهاز محمول صغير ، يمكن تكبير النص لتحسين إمكانية قراءته ، بينما على شاشة كبيرة ، يمكن تقليل النص لاستيعاب المزيد من المعلومات على الشاشة.
تشمل فوائد حجم الخط التكيفي ما يلي:
- تحسين قراءة النص على مختلف الأجهزة والشاشات
- تخطيط أكثر مرونة وقابلة للتطوير
- تحسين تجربة المستخدم وسهولة الاستخدام
- تحسين إمكانية الوصول إلى المعلومات لجميع المستخدمين
التمهيد ، واحدة من الأطر تطوير واجهة ويب شعبية ، ويوفر آليات لاستخدام حجم الخط التكيف في مكوناته. يتيح ذلك للمطورين إنشاء واجهات سريعة الاستجابة وسريعة الاستجابة تبدو رائعة على أي جهاز.
الخطوة 1: اتصال التمهيد
لاستخدام حجم الخط التكيفي في التمهيد ، يجب عليك أولا توصيل الإطار نفسه. يمكنك القيام بذلك عن طريق إضافة ارتباط إلى إصدار كندي من بوتستراب إلى قسم الرأس في مستند هتمل:
مثال اتصال التمهيد:
صفحتي
رمز أعلاه يربط أحدث إصدار من بوتستراب من خادم كدن. يمكنك وضع رابط إلى ملف كس التمهيد قبل علامة إغلاق الرأس (
نتيجة لذلك ، بعد تمكين التمهيد ، ستتمكن صفحتك من الوصول إلى أنماط ومكونات إطار العمل ، بما في ذلك القدرة على استخدام حجم خط متكيف.
الخطوة 2: استخدام فئة' العرض-1'
التمهيد لديه فئة 'العرض - 1' التي تسمح لك لتعيين حجم الخط على التكيف لعنصر. يخلق نصا كبيرا ومعبرا يجذب الانتباه.لاستخدام فئة 'العرض-1' ، قم بإضافته إلى العنصر حيث تريد تطبيق حجم خط قابل للتكيف. على سبيل المثال:
مرحبا ، العالم!
في هذا المثال ، استخدمنا فئة 'العرض-1' لعنصر رأس المستوى الأول. الآن النص هو " مرحبا ، العالم!"سيتم عرضه بشكل أكبر وإبرازه.
فئة 'العرض-1' في بوتستراب لديها السلوك التكيفي: يتفاعل مع التغيرات في حجم الشاشة ويضبط تلقائيا إلى ذلك. على سبيل المثال ، سيكون النص أكبر على شاشة كبيرة وأصغر على شاشة صغيرة.
الخطوة 3: استخدام وحدة القياس 'ريم'
يمكنك أيضا استخدام الطبقات التمهيد المدمج في لتغيير حجم الخط باستخدام وحدة القياس 'ريم'. على سبيل المثال ، سوف فئة ' ح1 ' تعيين حجم الخط من رأس ح1 المقابلة ل 2.5 ريم:
ح1 رأس |
باستخدام ' ريم ' وحدة القياس يسمح لك لضبط حجم الخط تلقائيا وفقا لتغيير حجم العنصر الجذر ، مما يجعلها مفيدة لخلق استجابة تصميم صفحة ويب. |
مزايا حجم الخط التكيفي يوفر حجم الخط التكيفي لصفحة الويب العديد من المزايا التي تعزز تجربة المستخدم وإمكانية الوصول إليه: |
1. تحسين قابلية القراءة يتيح لك حجم الخط التكيفي ضبط حجم النص تلقائيا على حجم الشاشة ودقة الجهاز. يساعد هذا في تحسين قابلية قراءة المحتوى ، خاصة على الشاشات الصغيرة أو عند تكبير الصفحة. |