خصوصية borderWidth للنمط

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

borderWidth يحدد هذا الخصوصية أو يعيد العرض عرض عرض الحدود للعنصر.

يمكن لهذا الخصوصية أن تأخذ من واحد إلى أربعة قيم:

  • قيمة واحدة، مثل: p {حجم الحدود: سميك} - جميع الأطراف الأربعة هي حدود سميكة
  • قيمتان، مثل: p {border-width: thick thin} - الحدود العلوية السفلية سميكة، الحواف الجانبية نحيفة
  • ثلاثة قيم، مثل: p {border-width: thick thin medium} - الحد الأعلى سميك، الحواف الجانبية نحيفة، الحد السفلي متوسط
  • أربعة قيم، مثل: p {border-width: thick thin medium 10px} - الحد الأعلى سميك، الحد الأيمن نحيف، الحد السفلي متوسط، الحد الأيسر 10px

يرجى الرجوع أيضًا إلى:

دليل تعليمات CSS:حواف CSS

دليل CSS:خصائص borderWidth

دليل HTML DOM:خصائص الحدود

مثال

مثال 1

تغيير عرض حافة العلامة <div> الأربعة:

document.getElementById("myDiv").style.borderWidth = "thick";

جرب بنفسك

مثال 2

تغيير عرض حافة العلامة <div> العلوية السفلية إلى سميك، عرض الحواف الجانبية إلى نحيفة:

document.getElementById("myDiv").style.borderWidth = "thick thin";

جرب بنفسك

مثال 3

استخدام قيم الطول لتغيير عرض حافة علامة <div> الأربعة:

document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";

جرب بنفسك

مثال 4

إرجاع عرض حافة علامة <div>:

alert(document.getElementById("myDiv").style.borderWidth);

جرب بنفسك

النحو

إرجاع borderWidth الخاصية:

object.style.borderWidth

تعيين borderWidth الخاصية:

object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
القيمة الوصف
thin تحديد حافة نحيفة.
medium تحديد حافة متوسطة. افتراضي.
thick تحديد حافة سميكة.
length عرض حافة بالطول.
initial ضع هذا الخصائص على قيمته الافتراضية. يرجى الرجوع إلى initial.
inherit يرث هذا الخصائص من العنصر الأب. يرجى الرجوع إلى inherit.

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

القيمة الافتراضية: medium
القيمة المطلوبة: الخط النصي، يمثل عرض حافة العنصر.
CSS إصدار： CSS1

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
الدعم الدعم الدعم الدعم الدعم