خصائص الحدود العمودية لـ CSS

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

border-block الخصائص هي اختصار للخصائص التالية:

• border-block-width
• border-block-style(مطلوب)
• border-block-color

إذا تم تجاهل قيمة اللون أو العرض، فإن القيمة الافتراضية سيتم استخدامها.

CSS border-block الخصائص border خصائص متشابهة، لكن border-block يعتمد الخاصية على الاتجاه العمودي.

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

مثال

مثال 1

ضبط النمط، اللون وعرض الحاجز للعناصر المختلفة في الاتجاه العمودي:

h1 {
  border-block: 5px solid red;
}
h2 {
  border-block: 4px dotted blue;
}
div {
  border-block: double;
}

جرب بنفسك

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

يحدد موقع الحاجز في الاتجاه العمودي. writing-mode تأثير الخاصية:

div {
  writing-mode: vertical-rl;
  border-block: hotpink dashed 8px;
}

جرب بنفسك

نحوية CSS

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

قيمة الخاصية

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

دعم المتصفح

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

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

دروس:حافات CSS

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

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

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

المرجع:خصائص عرض الحدود العمودية لـ CSS

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