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