أدوات مجانية
العربية
إنشاء زر CSS
إنشاء زر CSS — اختر الأبعاد أو الألوان وراجع الكود أو النتيجة. دليل الإدخال: لون الخلفية, اللون, المسافة الداخلية للزر (px), نصف قطر الزاوية (px). دون حساب.
دون حساب
جارٍ تحميل الأداة…
طريقة الاستخدام
- 1دليل الإدخال: لون الخلفية, اللون, المسافة الداخلية للزر (px), نصف قطر الزاوية (px).
- 2شغّل الأداة وراجع النتيجة.
- 3نسخ النتيجة / حفظ ملف النتيجة.
معلومات مفيدة
تحقق من النطاقات والوحدات. تعتمد النتائج على مدخلاتك ومتصفحك.
قد تعالج الإعلانات بيانات الاتصال. يتبع التخصيص خيارات خصوصيتك. الخصوصية (الإنجليزية)
مثال محسوب للمدخلات والمخرجات
هذه نتائج المحرك الفعلي بالقيم التجريبية أدناه، دون مدخلاتك الشخصية أو عملك المحفوظ. حمّل المثال في الأداة لمراجعة المدخلات نفسها.
مدخل تجريبي
| الحقل | القيمة |
|---|---|
| لون الخلفية | #0F766E |
| اللون | #FFFFFF |
| المسافة الداخلية للزر (px) | 12 |
| نصف قطر الزاوية (px) | 12 |
نتيجة المثال
.button {
background: #0F766E;
color: #FFFFFF;
padding: 12px 24px;
border: 0;
border-radius: 12px;
min-height: 44px;
cursor: pointer;
}
.button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }شروط الإدخال
هذه حدود التحقق الفعلية، ولا تضمن أن كل قيمة مقبولة واقعية أو مناسبة لحالتك.
- المسافة الداخلية للزر (px): النطاق المقبول: 4 ≤ x ≤ 40
- نصف قطر الزاوية (px): النطاق المقبول: 0 ≤ x ≤ 100