Sofia Emelianova
Narzędzia deweloperskie w Chrome pozwalają intuicyjnie debugować układy siatki CSS dzięki wielu opcjom wizualizacji.
Obejrzyj film, by dowiedzieć się, jak włączyć nakładkę z siatką w panelu Elementy i za jej pomocą:
- Wizualizacja i sprawdzanie układów siatki.
- Sprawdź numery wierszy i kolumn, do których należy się odwoływać podczas umieszczania elementów siatki.
- Jeśli masz dużo elementów siatki i ich liczby są mylące, użyj nazw linii i obszarów, a zobaczysz je na nakładce.
- Sprawdź rozmiary ścieżek.
Dodatkowo za pomocą Edytora siatki w panelu Elementy > Style możesz jednym kliknięciem wyrównywać elementy i ich zawartość w układzie siatki, zamiast wpisywać reguły CSS.
Aby zapoznać się z bardziej praktycznym doświadczeniem, zapoznaj się z samouczkiem Sprawdzanie siatki CSS.