نمط الخاصية borderWidth
مثال
غيّر عرض الحدود الأربعة لعنصر <div>:
document.getElementById("myDiv").style.borderWidth = "thick";
التعريف والاستخدام
تقوم الخاصية borderWidth بتعيين عرض حدود العنصر أو إرجاعه.
يمكن أن تأخذ هذه الخاصية من قيمة واحدة إلى أربع قيم:
- قيمة واحدة ، مثل: p {border-width: thick} - ستكون الحدود الأربعة سميكة
- قيمتان ، مثل: p {border-width: thick thin} - سيكون الحد العلوي والسفلي سميكًا والحد الأيسر والأيمن رقيق
- ثلاث قيم ، مثل: p {border-width: Thick Thin medium} - الحد العلوي سميك ، والحد الأيسر والأيمن رفيع ، والحد السفلي متوسط
- أربع قيم ، مثل: p {border-width: thick thin medium 10px} - الحد العلوي سميك ، الحد الأيمن رفيع ، الحد السفلي متوسط ، الحد الأيسر 10px
دعم المتصفح
Property | |||||
---|---|---|---|---|---|
borderWidth | Yes | Yes | Yes | Yes | Yes |
بناء الجملة
قم بإرجاع خاصية borderWidth:
object.style.borderWidth
قم بتعيين الخاصية borderWidth:
object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
قيم الملكية
Value | Description |
---|---|
thin | Defines a thin border |
medium | Defines a medium border. This is default |
thick | Defines a thick border |
length | The width of the border in length units |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
تفاصيل تقنية
القيمة الافتراضية: | متوسط |
---|---|
قيمة الإرجاع: | سلسلة ، تمثل عرض حد العنصر |
إصدار CSS | CSS1 |
مزيد من الأمثلة
مثال
غيّر عرض الحد العلوي والسفلي إلى سميك ، والحد الأيسر والأيمن إلى رفيع لعنصر <div>:
document.getElementById("myDiv").style.borderWidth = "thick thin";
مثال
غيّر عرض الحدود الأربعة لعنصر <div> باستخدام قيمة الطول :
document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";
مثال
قم بإرجاع عرض حد عنصر <div>:
alert(document.getElementById("myDiv").style.borderWidth);
الصفحات ذات الصلة
دروس CSS: CSS Border
مرجع CSS: خاصية عرض الحدود
مرجع DOM HTML: خاصية الحدود
❮ نمط الكائن