مولّد CSS Grid
الخطأ: استخدام النتيجة خارج النطاق الموضح.
التصحيح: أنشئ شبكة CSS بأعمدة متساوية وعدل الكود لصفحتك.
الأرشيف · مجاني
مولّد CSS Grid
أنشئ معاينة شبكة وكود CSS من عدد الأعمدة والصفوف والمسافات.
هذه الأداة مؤرشفة. تحقّق من طريقتها وبياناتها المؤرّخة مجددًا قبل الاستخدام.
01أدخل القيم
تعمل في متصفحكيعمل دون اتصال داخل المتصفح. بعد تحميل الصفحة والملفات اللازمة، لا تحتاج المعالجة إلى الإنترنت.
02مولّد CSS Grid
تعمل في متصفحك
كيف تعمل؟
أنشئ معاينة شبكة وكود CSS من عدد الأعمدة والصفوف والمسافات.
تعمل في متصفحك
بياناتك تبقى لديك
تُعالج المدخلات في هذه الصفحة ولا تُرسل إلى أي خادم.
عن الأداة
استخدم الأداة ↑أنشئ معاينة شبكة وكود CSS من عدد الأعمدة والصفوف والمسافات.
أنشئ شبكة CSS بأعمدة متساوية وعدل الكود لصفحتك.
- أدخل القيم
- الأعمدة
- الصفوف
- المسافة
- طريقة الحساب
أنشئ معاينة شبكة وكود CSS من عدد الأعمدة والصفوف والمسافات.
- مثال تطبيقي · النتيجة
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
طريقة الحساب
- أنشئ شبكة CSS بأعمدة متساوية وعدل الكود لصفحتك.
مولّد CSS Grid
- الأعمدة
- 3
- الصفوف
- 2
- المسافة
- 16 px
النتيجة
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
أسئلة شائعة
كيف أفسر النتيجة؟
أنشئ شبكة CSS بأعمدة متساوية وعدل الكود لصفحتك.
أين تذهب بياناتي؟
تجري الحسابات على جهازك. لا تُرسل المدخلات إلى خادم.
المصطلحات والتعريفات
أدخل القيم
- الأعمدة
أدخل عددًا صحيحًا دون كسور.
الحد الأدنى: 1 · الحد الأقصى: 12
- الصفوف
أدخل عددًا صحيحًا دون كسور.
الحد الأدنى: 1 · الحد الأقصى: 12
- المسافة
أدخل القيمة العددية لهذه الكمية. استخدم الوحدة المعروضة بجانب الحقل. px
الحد الأدنى: 0 · الحد الأقصى: 100 px
النتيجة
- النتيجة
أنشئ شبكة CSS بأعمدة متساوية وعدل الكود لصفحتك.
يُحسب من مدخلاتك وفق الطريقة أدناه.
أخطاء شائعة وطرق تصحيحها
الحدود والافتراضات الأساسية
- أنشئ شبكة CSS بأعمدة متساوية وعدل الكود لصفحتك.
- قد تُقرّب النتائج المعروضة؛ التقريب لا يزيد دقة القياس.