English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
يستخدم border-bottom-right-radius في CSS لضبط نمط الزوايا العلوية اليمنى للعنصر. يمكن أن يكون هذا الدائرة أو البيضاوية، وعندما يكون القيمة 0 تكون الزاوية العلوية اليمنى عادية، وسيؤثر هذا الخاصية على شكل الخلفية سواء كانت صورة أو لون،
الجدول أدناه يوضح كيفية استخدام هذه الخاصية وتاريخها الإصداري، بالإضافة إلى استخدامها في سكربتات جافا سكريبت.
| القيمة الافتراضية: | 0 |
|---|---|
| يُستخدم في: | جميع العناصر |
| الوراثة: | لا يوجد |
| يمكن تحريكه: | نعم.يرجى الرجوع إلى خصائص التحريك. |
| الإصدار: | ميزات CSS3 الجديدة |
| جافا سكريبت: | object object.style.borderBottomRightRadius="8px" |
ملاحظة:حتى لو لم يتم تعريف الحواف أو تعيينها إلى none، فإن خاصية border-bottom-right-radius ستجعل خلفية العنصر محدبة.
نحو استخدام هذه الخاصية هو كما يلي:
border-bottom-right-radius: [length | percentage]1 أو 2 values | initial | inherit
يمكن استخدام هذا الرمز باستخدام مسافات واحدة أو اثنتين منفصلة بالفراغات.
قيمة الطول الثانية الاختيارية تعرف البعد العمودي للزاوية اليمنى العليا، وبالتالي يكون شكل الزاوية ربع دائرة مستديرة.
إذا تم تمرير القيمة الثانية أو كان متساويًا لها، فإن شكل الزاوية يكون ربع دائرة.
يوضح المثال أدناه كيفية استخدام الخاصية border-bottom-right-radius.
div {
border: 2px solid #f08080;
border-bottom-right-radius: 20px;
}جرب لمعرفة‹/›يصف الجدول التالي قيم هذه الخاصية.
| القيمة | وصف |
|---|---|
| length | يمكن أن تكون وحدة القيمة ممكنة كـ px، pt، cm، em وما إلى ذلك، لكن لا يُسمح بالقيم السلبية. |
| percentage | حجم البعد، بمقياس المائة. في حالة وجود قيمتين، يتم حساب النسبة المئوية الأولى بالنسبة لعرض العنصر (أي، البعد الأفقي)، والنسبة المئوية الثانية بالنسبة لارتفاع العنصر (أي، البعد العمودي). لا يُسمح بالقيم السلبية. |
| initial | أعد هذا الخصائص إلى قيمته الافتراضية. |
| inherit | إذا تم تحديد هذا، فإن العنصر المرتبط يستخدم قيمة الخاصية border-bottom-right-radius للاب |
مستوى التطابق للمتصفحات في الخاصية border-bottom-right-radius، الأرقام في الجدول التالي تمثل أحدث إصدار من المتصفح الذي يدعم الخاصية. يدعم جميع المتصفحات الرئيسية هذه الخاصية.
|
تحذير: Internet Explorer 8 و الإصدارات الأقدم لا تدعم الخاصية border-bottom-right-radius. يدعمها الإصدار IE9 و الإصدارات الأحدث.
انظر إلى الدروس:CSS Border,CSS3 Border.
خصائص ذات صلة:border-radius,border-bottom-left-radius,border-top-left-radius,border-top-right-radius.