خصائص inset-block-start CSS

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

inset-block-start خصائص لتحديد المسافة بين بدء العنصر في الاتجاه الصف والعنصر الأب.

ملاحظة:لجعل هذا الخاصية يعمل، يجب تحديد position خصائص

CSS inset-inline و خصائص inset-block خصائص مع CSS العلوي،الأسفل،اليسار و اليمين مثل خصائص inset-block و inset-inline يعتمد الخاصية على الاتجاه الصف والاتجاه السطر.

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

مثال

مثال 1

يُحدد المسافة بين بدء العنصر المحدد الموضع في اتجاه الصف بين العنصر الأب:

div {
  inset-block-start: 50px;
}

جرب بنفسك

مثال 2

عندما يكون <div> العنصر writing-mode عندما يتم تعيين الخاصية إلى vertical-rl، يكون اتجاه الصف من اليمين إلى اليسار. النتيجة هي أن يتحرك بدء العنصر من الأعلى إلى اليمين:

div {
  inset-block-start: 50px;
  writing-mode: vertical-rl;
}

جرب بنفسك

جافا سكربت CSS

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

قيمة الخاصية

القيمة الوصف
auto القيمة الافتراضية. يتم استخدام المسافة inset الافتراضية للعنصر.
length

تُحدد المسافة باستخدام وحدات ثابتة (مثل px، pt، cm إلخ). يُسمح بالقيم السلبية.

يرجى الرجوع إلى:واحدهای CSS.
% تُحدد المسافة باستخدام النسبة المئوية، بالنسبة إلى حجم العنصر الأب في المحور المطلوب.
initial ضبط هذا الخاصية إلى قيمتها الافتراضية. يرجى الرجوع إلى: initial.
inherit ينتقل هذا الخاصية من عنصر الأب إلى هذا الخاصية. يرجى الرجوع إلى: inherit.

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

القيمة الافتراضية: auto
التوريث: لا
صنع الحركة: يدعم. يرجى الرجوع إلى:خصائص الحركة.
الإصدار: CSS3
جافا سكربت: object.style.insetBlockStart="100px"

دعم المتصفح

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

كروم إدج فايرفوكس سفاري أوبرا
87.0 87.0 63.0 14.1 73.0

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

دروس:توضيح CSS

المرجع:خصائص position CSS

المرجع:خصائص writing-mode CSS