خصائص border-width CSS

توصية بالكورسات:

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

سمة borderWidth تُحدد عرض جميع الحدود للعنصر أو تُحدد عرض الحدود للحدود الفردية.

ينطبق فقط عندما يكون نمط الحدود غير none. إذا كان نمط الحدود none، يتم إعادة تعيين عرض الحدود في الواقع إلى 0. لا يُسمح بتحديد قيم الطول السلبية.

مثال 1
  • border-width:thin medium thick 10px;
  • الحاجز العلوي نحيف
  • الحاجز العلوي 10px
  • الحاجز الأيمن متوسط

الحاجز الأيسر عرضه 10px

مثال 2
  • border-width:thin medium thick;
  • الحاجز العلوي والحاجز السفلي نحيفان
  • الحاجز العلوي 10px

الحاجز السفلي كبير

مثال 3
  • border-width:thin medium;
  • الحاجز العلوي والحاجز السفلي نحيفان

الحاجز الأيمن والحاجز الأيسر نحيفان

مثال 4
  • border-width:thin;

جميع الأربعة حدود نحيفة

مثال

تحديد عرض جميع الحدود الأربعة:
  p
  {
  border-style:solid;
  border-width:15px;

}

تجربة شخصية

الصيغة CSSالطولborder-width: medium|thin|thick|

قيمة السمة|الافتراضي|وراثة;

القيمة الوصف
نحيفة نحيفة
متوسط افتراضي. يحدد الحدود المتوسطة.
كبيرة يحدد الحدود الكبيرة.
الطول يدخر لك إمكانية تخصيص عرض الحدود.
وراثة يُتوقع أن تُورث السمة عرض الحدود من العنصر الأم.

مزيد من الأمثلة

جميع أسمة العناصر الحدودية في إعلان واحد
هذا المثال يوضح كيفية استخدام الصيغة المختصرة لضبط جميع أسمة العناصر الحدودية في نفس الإعلان.

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

القيمة الافتراضية: متوسط
الوراثة: لا
الإصدار: CSS1
جافا سكربت الصيغة: الجسم.style.borderWidth="thin thick"

دعم المتصفحات

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

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5

انظر أيضًا:

دليل CSSحافات CSS

دليل DOM HTML المقدمسمة borderWidth