Генератор CSS Grid
Помилка: Застосовувати результат поза описаною областю.
Виправлення: Створіть CSS Grid з рівними стовпцями й адаптуйте код до сторінки.
Архів · Безкоштовно
Генератор CSS Grid
Створіть попередній перегляд сітки й CSS зі стовпців, рядків і відступів.
Цей інструмент в архіві. Перед використанням перевірте методику та датовані дані.
01Введіть значення
Працює у браузеріПрацює у браузері без інтернету. Після завантаження сторінки та потрібних файлів обробка не потребує інтернету.
02Генератор CSS Grid
Працює у браузері
Як це працює
Створіть попередній перегляд сітки й CSS зі стовпців, рядків і відступів.
Працює у браузері
Дані залишаються у вас
Дані обробляються на цій сторінці й не надсилаються на сервер.
Про інструмент
Використати інструмент ↑Створіть попередній перегляд сітки й CSS зі стовпців, рядків і відступів.
Створіть CSS Grid з рівними стовпцями й адаптуйте код до сторінки.
- Введіть значення
- Стовпці
- Рядки
- Проміжок
- Метод розрахунку
Створіть попередній перегляд сітки й CSS зі стовпців, рядків і відступів.
- Приклад · Результат
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
Метод розрахунку
- Створіть CSS Grid з рівними стовпцями й адаптуйте код до сторінки.
Генератор 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 Grid з рівними стовпцями й адаптуйте код до сторінки.
Куди потрапляють мої дані?
Обчислення виконуються на пристрої. Дані не надсилаються на сервер.
Терміни та пояснення
Введіть значення
- Стовпці
Введіть ціле число, без дробів.
Мінімум: 1 · Максимум: 12
- Рядки
Введіть ціле число, без дробів.
Мінімум: 1 · Максимум: 12
- Проміжок
Введіть числове значення величини. Використовуйте одиницю біля поля. px
Мінімум: 0 · Максимум: 100 px
Результат
- Результат
Створіть CSS Grid з рівними стовпцями й адаптуйте код до сторінки.
Обчислюється з ваших даних за методом нижче.
Поширені помилки й виправлення
Обмеження та припущення
- Створіть CSS Grid з рівними стовпцями й адаптуйте код до сторінки.
- Результати можуть округлюватися; це не підвищує точність виміру.