مجانية الاستخدام، دون حساب

CSS مولد نصف قطر الحدود

قم بتشكيل كل زاوية بشكل مستقل، بما في ذلك نصف القطر الأفقي والرأسي البيضاوي. قم بمعاينة النتيجة ونسخ ملف CSS المضغوط.

أدخل 0–2,000 px أو 0–100%. يتم توفير عناصر التحكم في الأرقام التي يمكن الوصول إليها من خلال لوحة المفاتيح.

أعلى اليسار
أعلى اليمين
أسفل اليمين
أسفل اليسار

CSS تلقائيًا بقياس نصف قطر الزاوية بشكل متناسب عندما يتجاوز مجموعها عرض العنصر أو ارتفاعه. تتبع المعاينة سلوك CSS للمتصفح.

معاينة مباشرة

اضبط الزاوية لمعاينة شكلها.

CSS

كيف يمكنني إنشاء قيم CSS border-radius؟

اختر وحدات البكسل أو النسب المئوية، واضبط نصف القطر الأفقي والرأسي لكل زاوية، ثم انسخ إعلان border-radius الذي تم إنشاؤه. قد يقوم CSS بتطبيع أنصاف الأقطار المتداخلة بشكل متناسب ليناسب العنصر.

الأسئلة الشائعة

كيف يمكنني إنشاء قيم CSS border-radius؟

اختر وحدات البكسل أو النسب المئوية، واضبط نصف القطر الأفقي والرأسي لكل زاوية، ثم انسخ إعلان border-radius الذي تم إنشاؤه. قد يقوم CSS بتطبيع أنصاف الأقطار المتداخلة بشكل متناسب ليناسب العنصر.

هل تم تحميل CSS أو تصميمي؟

لا. يتم إنشاء المعاينة وCSS في علامة تبويب المتصفح هذه. لا يوجد تحميل أو حساب أو استدعاء API أو حفظ تلقائي.

هل يمكن أن يكون لكل زاوية نصف قطر مختلف؟

نعم. قم بتعيين قيمة أفقية ورأسية منفصلة للزوايا العلوية اليسرى واليمنى العلوية والسفلية اليمنى والسفلية اليسرى.

ماذا تعني الشرطة المائلة في border-radius؟

يفصل نصف القطر الأفقي عن نصف القطر الرأسي، مما يخلق زوايا بيضاوية. إذا كانت كل زاوية تستخدم نفس القيمة الأفقية والرأسية، فإن المولد يحذف الشرطة المائلة.

لماذا قد تبدو المعاينة أصغر من القيم؟

CSS بتطبيع أنصاف الأقطار التي قد تتداخل عند الحافة بشكل متناسب. وهذا هو السلوك القياسي للمتصفح ويتم تطبيقه أيضًا في هذه المعاينة.