خصائص block-size CSS

التعريف والاستخدام

block-size الخاصية تحدد حجم العنصر في اتجاه السطر.

ملاحظة:خصائص CSS ذات الصلة writing-mode يدفع إلى اتجاه السطر، مما يؤثر على block-size للصفحات باللغة الإنجليزية، اتجاه السطر أسفل، واتجاه الرفاعي من اليسار إلى اليمين.

CSS block-size و inline-size خصائص تؤثر على width و height خصائص تشبه بعضها البعض، ولكن block-size و inline-size الخاصية تعتمد على اتجاه السطر والاتجاه الرفاعي.

مثال

مثال 1

ضبط حجم العنصر <div> في اتجاه السطر:

div {
  block-size: 200px;
}

جرب بنفسك

مثال 2

عندما يتم تعيين قيمة خاصية writing-mode لعنصر <div> إلى vertical-rl، يتحول اتجاه السطر من أسفل لأعلى إلى أفقي، مما يغير اتجاه تأثير خاصية block-size:

div {
  block-size: 250px;
  writing-mode: vertical-rl;
}

جرب بنفسك

نص النسخة المطبوعة

inset-block: auto|length|initial|inherit;

قيمة الخاصية

تفاصيل التقنية

دعم المتصفحات

الرقم في الجدول يعني إصدار المتصفح الأول الذي يدعم هذه الخاصية بشكل كامل.

الصفحات ذات الصلة

دليل CSS:الارتفاع والعرض CSS

دليل CSS:نموذج الصندوق CSS

مرجع CSS:خاصية height

مرجع CSS:خاصية width

مرجع CSS:خاصية writing-mode