/
magarich
/
web
Обзор
Документация
Войти
/
magarich
/
web
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
html/lab2/task7/style.css
46 строк
2 KB
Юра Магарьян
Final submission: Lab2 and Lab3 by Magaryan Yury PIZ2402
17 апр 2026, 23:12
17 апр 2026, 23:12
0827836
Код
Авторство
О чём код?
body { margin: 0; background: #000; display: flex; justify-content: center; } .grid { display: grid; grid-template-columns: repeat(12, 1fr); /* Десктоп: 12 колонок */ grid-auto-rows: 100px; gap: 10px; width: 95%; max-width: 1200px; background: white; padding: 10px; } /* Цвета для наглядности */ .block { border-radius: 4px; } .header1 { background: #20c997; grid-column: span 2; } .header2 { background: #20c997; grid-column: span 8; } .header3 { background: #20c997; grid-column: span 2; } .big-top { background: #4dabf7; grid-column: span 12; grid-row: span 2; } .left-top { background: #20c997; grid-column: span 6; grid-row: span 2; } .right-big { background: #fcc419; grid-column: span 6; grid-row: span 4; } .left-bottom { background: #ae3ec9; grid-column: span 6; grid-row: span 2; } .footer { background: #343a40; grid-column: span 12; grid-row: span 2; } /* Телефоны: 4 колонки */ @media (max-width: 768px) { .grid { grid-template-columns: repeat(4, 1fr); } .header1 { grid-column: span 1; } .header2 { grid-column: span 2; } .header3 { grid-column: span 1; } .big-top { grid-column: span 4; } .left-top { grid-column: span 2; } .right-big { grid-column: span 2; grid-row: span 4; } .left-bottom { grid-column: span 2; } .footer { grid-column: span 4; } }