انتقل إلى محتوى الدرس
ابدأ رحلتك
فقرة فرعية #3 من درس: الخصائص المنطقية في لغة CSS

Logical Inline and Block Sizing الأبعاد المنطقية للعرض والارتفاع

ابنِ واجهات عربية وإنجليزية متكيفة تلقائياً بملف أنماط واحد عبر الخصائص المنطقية للأبعاد والهوامش والحشوات والإطارات وتدوير الزوايا وإزاحات التموضع المرتبطة باتجاه تدفق النص.
1 صفوف تعليمية
لغة CSS
2 مشاهدة

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

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

تستبدل خصائص الأبعاد المنطقية كلاً من العرض والارتفاع الفيزيائيين بأبعاد مرنة تتبع محاور الكتابة النشطة:

  • الحجم السطري inline-size وحدوده min-inline-size وmax-inline-size: يضبط امتداد العنصر على طول السطر، فيكافئ width وحدوده في الوضع الأفقي، ويتحول تلقائياً لضبط الطول العمودي عند تدوير العنصر بوضع كتابة عمودي.
  • الحجم الكتلي block-size وحدوده min-block-size وmax-block-size: يضبط بُعد تكدس الكتل، فيكافئ height وحدوده في الوضع الأفقي المعتاد.

فعند كتابة max-inline-size: 420px مع min-block-size: 120px تحصل على صندوق متجاوب يحافظ على تناسقه سواء عُرض أفقياً أو عمودياً.

جميع فقرات هذا الدرس (الخصائص المنطقية في لغة CSS)