خصائص الحدود الداخلية CSS

الصفحة السابقة width
الصفحة التالية color

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

border-inline الصفات هي اختصار للصفات التالية:

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

CSS border-inline الصفات مع border الصفات متشابهة جدًا، لكن border-inline الخاصية تعتمد على الاتجاه الأفقي.

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

مثال

مثال 1

حدد نمط، لون وعرض الحد الأفقي للنصوص المختلفة:

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

جرب بنفسك

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

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

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

جرب بنفسك

قواعد CSS

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

قيمة الخاصية

القيمة	الوصف
border-inline-width	حدد عرض الحد الأفقي للخط. القيمة الافتراضية هي "medium".
border-inline-style	حدد نمط الحد الأفقي للخط. القيمة الافتراضية هي "لا شيء".
color	حدد لون الحد الأفقي للخط. القيمة الافتراضية هي لون النص.
initial	ضع هذه الخاصية على قيمتها الافتراضية. راجع initial.
inherit	تنقل هذه الخاصية من عنصر الأب. راجع inherit.

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

القيمة الافتراضية:	medium none color
التنسيق:	لا
إنتاج الأنيمات:	نعم، راجع الخاصيات الفردية. اقرأ عن animatable
الإصدار:	CSS3
قواعد JavaScript:	object.style.borderInline="dashed hotpink 10px"