طريقة الاستخدام
ترتيب القيم الأربع: أعلى اليسار، أعلى اليمين، أسفل اليمين، أسفل اليسار.
border-radius: 40px 8px 40px 8px;في وضع الشكل الحر تُكتب ثماني نسب: أربع للمحور الأفقي ثم «/» ثم أربع للعمودي، فتنتج أشكالاً عضوية غير منتظمة.
border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;للدائرة استعمل 50% على عنصر مربع، ولشكل الكبسولة قيمة كبيرة مثل 999px.
مثال عملي
زر بشكل كبسولة: border-radius: 999px، وصورة شخصية دائرية: border-radius: 50%.
أسئلة شائعة
لماذا لا تصبح الصورة دائرة؟
يجب أن يكون العنصر مربعاً (العرض = الارتفاع) مع 50%.
ما الفرق بين px و%؟
px قيمة ثابتة، و% نسبة من أبعاد العنصر فتتغير معه.
هل تتأثر الزوايا باتجاه الصفحة العربية؟
لا، border-radius يستعمل الاتجاهات الفعلية (يسار ويمين) دائماً.