CSS Izgara Oluşturucu

Eşit boyutlu izlere sahip bir CSS Grid'i görsel olarak oluşturun. Sütun sayısını (1–12), satır sayısını (1–12) ve boşluğu (0–32px) ayarlayın; araç, numaralı hücrelerden oluşan canlı bir ızgara ve grid-template-columns: repeat(N, 1fr) ile grid-template-rows: repeat(M, 1fr) kullanan dört satırlık bir CSS parçası oluşturur.

1. Eşit 1fr sütun sayısını ayarlamak için Sütunlar kaydırıcısını (1–12) sürükleyin. 2. Eşit 1fr satır sayısını ayarlamak için Satırlar kaydırıcısını (1–12) sürükleyin. 3. Hücreler arasındaki oluğu ayarlamak için Boşluk kaydırıcısını (0–32px) sürükleyin. 4. Dört satırlık CSS bildirim bloğunu kopyalamak için Kopyala'ya tıklayın.

Çıktı her zaman tam olarak dört satırdır: display: grid; grid-template-columns: repeat({cols}, 1fr); grid-template-rows: repeat({rows}, 1fr); gap: {gap}px. Tüm izler eşit kesirlerdir (1fr) — bu araçta karışık boyutlar, minmax, auto-fit/auto-fill veya adlandırılmış alanlar desteklenmez.