خصائص الحدود-block النهائية CSS

التوصيات التعليمية:

border-block-end التعريف والاستخدام

CSS border-block-end خصائص هي اختصارات لخصائص CSS التالية: border-bottom،border-left،border-right و border-top خصائص متشابهة للغاية، لكن border-block-end يعتمد الخاصية على اتجاه البلاك.

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

مثال

مثال 1

ضبط عرض، لون ونمط الحافات في نهاية اتجاه البلاك:

div {
  border-block-end: 10px solid pink;
}

جرب بنفسك

مثال 2: دمج خاصية writing-mode

يؤثر موقع نهاية اتجاه البلاك للحافات writing-mode تأثير الخاصية:

div {
  writing-mode: vertical-rl;
  border-block-end: dotted blue;
}

جرب بنفسك

جملة CSS

border-block-end: border-block-end-width border-block-end-style border-block-end-color|initial|inherit;

قيمة الخاصية

القيمة الوصف
border-block-end-width

تحديد عرض الحافات للعنصر في نهاية اتجاه البلاك.

القيمة الافتراضية هي "medium".

border-block-end-style

تحديد نمط الحافات للعنصر في نهاية اتجاه البلاك.

القيمة الافتراضية هي "لا".

لون نهاية الحافة العمودية

تحديد لون الحافات للعنصر في نهاية اتجاه البلاك.

القيمة الافتراضية هي لون الحافات الحالي.

initial ضبط هذا الخاصية إلى قيمتها الافتراضية. راجع initial.
inherit ينتقل إلى هذا الخاصية من عنصر الأب. راجع inherit.

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

القيمة الافتراضية: medium none currentcolor
التوريث: لا
صنع المتحرك: يدعم. راجع:خصائص المتحرك.
الإصدار: CSS3
جافا سكربت الجملة: object.style.borderBlockEnd="pink dotted 5px"

دعم المتصفح

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

كروم إدج فايرفوكس سفاري أوبرا
69.0 79.0 41.0 12.1 56.0

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

تعليمات:حافة CSS

مرجع:خصائص الحدود CSS

مرجع:خصائص الحدود-block CSS

مرجع:خصائص لون الحدود-block CSS

مرجع:خصائص لون الحدود-block البداية CSS

مرجع:خصائص لون الحدود السفلية CSS

مرجع:خصائص border-left-color CSS

مرجع:خصائص border-right-color CSS

مرجع:خصائص border-top-color CSS

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