شرح صفوف ومحتوى الفقرة
تشترك خصائص التباعد الخمس جميعاً في كونها خصائص موروثة (Inherited) تنتقل تلقائياً من العنصر الأب إلى الأبناء، مما يتيح لك تأسيس إيقاع قراءة موحد للصفحة بأقل قدر من الكود. وعند فحص أي فقرة داخل تبويب Computed في أدوات المطور DevTools، تذكر أن المتصفح يعرض النتيجة النهائية بالبكسل حتى لو كتبت line-height: 1.6 كرقم مجرد.
| الخاصية | نطاق التأثير | القيمة الموصى بها | القاعدة مع النصوص العربية |
|---|---|---|---|
line-height | الارتفاع الرأسي لصندوق كل سطر | رقم مجرد من 1.5 إلى 1.8 | آمنة؛ يُفضل 1.65 فأكثر لراحة التشكيل |
letter-spacing | المسافة الأفقية بين الحروف المتجاورة | normal أو 1px..3px للاتيني | اتركها normal أو 0 لمنع تقطيع الحروف |
word-spacing | اتساع الفراغ الفاصل بين الكلمات | normal أو 2px..6px | آمنة تماماً لأنها لا تمس اتصال الكلمة |
text-indent | إزاحة بداية السطر الأول فقط | 0 أو 1.5em..2em | تنعكس تلقائياً لتبدأ من جهة اليمين |
tab-size | عرض مسافة الجدولة في النص المنسق مسبقاً | عدد صحيح 2 أو 4 | مثالية لضبط مقاطع الكود داخل <pre> |
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
أصبحت الآن قادراً على ضبط راحة قراءة الفقرات عبر الأرقام المجردة في line-height، وتوسيع المسافة بين الكلمات بأمان عبر word-spacing، وإزاحة أول سطر عبر text-indent، وتقليص الجدولة عبر tab-size مع حماية اتصال الحروف العربية. في الخطوة التالية ننتقل إلى درس المساحات البيضاء للنصوص في لغة CSS للتحكم في دمج المسافات والتفاف الأسطر.