ویژگی border-inline CSS

تعریف و استفاده

border-inline ویژگی کوتاه‌نویسی از ویژگی‌های زیر است:

• border-inline-width
• border-inline-style(ضروری)
• border-inline-color

اگر مقدار رنگ یا عرض را省ید، از مقدار پیش‌فرض استفاده خواهد شد.

CSS border-inline ویژگی با border ویژگی‌ها بسیار مشابه هستند، اما border-inline ویژگی وابسته به جهت خطی درونی است.

توجه:ویژگی‌های CSS مرتبط writing-modeوtext-orientation و direction تعریف جهت خطی را مشخص می‌کند. این تأثیرگذار بر شروع و پایان یک خط و 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;

مقدار ویژگی

جزئیات فنی

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر پشتیبان از این ویژگی هستند.

صفحات مرتبط

آموزش:پردازش حاشیه CSS

ارجاع:ویژگی border CSS

ارجاع:ویژگی border-inline-color CSS

ارجاع:ویژگی border-inline-style CSS

ارجاع:ویژگی border-inline-width CSS

ارجاع:ویژگی direction CSS

ارجاع:خصوصیت text-orientation CSS

ارجاع:خصوصیت writing-mode CSS