انتقل إلى محتوى الدرس

Font Size Weight Line Height حجم ووزن الخط وارتفاع السطر

أتقن أدوات النصوص والروابط في بوتستراب 5.3 بدءاً من المحاذاة المنطقية الداعمة للعربية والقص بالنقاط وأحجام الخطوط وحتى تلوين الروابط والتحكم بالتحديد والمؤشر.
3 صفوف تعليمية
بوتستراب 5
0 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تتيح لك كلاسات الحجم .fs-1 الأضخم حتى .fs-6 الأصغر التحكم في مقاس النص بصرياً بمعزل تام عن الرتبة الدلالية لوسوم العناوين؛ فلا تضطر لكسر تسلسل محركات البحث بكتابة وسم <h2> لمجرد تكبير رقم إحصائي في لوحة التحكم، بل تبقيه داخل <p class="fs-2 fw-bold">.

ويتكامل سلم الحجم مع كلاسات السماكة مثل .fw-bold و.fw-semibold و.fw-medium و.fw-light، وكلاسات الميلان .fst-italic و.fst-normal، وأربع درجات لضبط ارتفاع السطر هي .lh-1 للعناوين المدمجة و.lh-sm و.lh-base و.lh-lg للمقالات الطويلة المريحة للقراءة.

الصف 2 كود برمجي
HTML
<p class="fs-2 fw-bold mb-1">24,850 Active Learners</p>
<p class="fs-5 fw-semibold text-primary">Weekly Report</p>
<p class="lh-lg border p-3 bg-body-tertiary mb-0">
  Generous line height improves reading comfort across
  multi-line educational articles on all viewports.
</p>
الصف 3 ملاحظة هامة