Курс HTML/CSS Advanced | Позиционирование CSS Grid: теория + практика
В этой серии уроков я расскажу про один из самых мощных и эффективных методов позиционирования HTML элементов. Это CSS Grid.
Мы начнем с теории CSS Grid и изучим его основные свойства, такие как: display: grid, grid-template-columns, grid-template-rows, gap, column-gap, row-gap, grid-auto-rows, grid-auto-flow, grid-template-areas, place-content, а также css функции, как repeat(), minmax() и многое другое.
После теории CSS Grid мы с вами перейдем к практике и сверстаем из HTML5 шаблона разные типы сайтов: Сайт с одной колонкой, сайт с двумя колонками и сайт с 3x колоночным типом.
Я рекомендую изучать CSS Grid на сайте FructCode, где ты сразу сможешь закреплять полученные знания на практике, выполняя интерактивные упражнения CSS Grid в браузере.
Я создал целый раздел посвященный CSS Grid позиционированию:
Новые уроки каждую неделю!
Мы в социальных сетях:
Fac
44 views
1801
520
2 months ago 00:27:10 1
Основы HTML/CSS | Урок #1. Основы HTML5. Синтаксис и базовая структура HTML. Теги и атрибуты
2 months ago 02:03:50 1
Практика JavaScript с нуля за 2 часа. Сделаем целый сайт!
2 months ago 11:55:00 1
Frontender[1.0] - Модуль 1 | Курс по FRONTEND | HTML, CSS, SCSS, GIT, NPM, SEO, A11Y | УРОКИ [2-55]
2 months ago 00:16:52 1
Сравнение новых псевдоклассов CSS — :is() :where() :has()
2 months ago 00:01:11 1
КАК ПРАВИЛЬНО УСТАНОВИТЬ CLIENT MOD НА АНДРОЙД
2 months ago 00:07:08 1
Как скачать сайт целиком с картинками из CSS и шрифтами
2 months ago 00:09:38 1
Будущее CSS-анимаций — scroll-timeline, animation-timeline и animation-range, JS больше не нужен!
2 months ago 00:19:37 1
⚡️ Эта CSS новинка уничтожила SCSS
2 months ago 06:46:14 1
JavaScript для начинающих 2024. Полный курс за 6 часов. Уроки. Теория + практика
2 months ago 01:13:57 1
Frontend Roadmap 2024. План + Ресурсы для бесплатного обучения.
2 months ago 04:42:31 18
Верстка сайта HTML SCSS из Figma на Gulp сборке. Проект Modimal. Адаптивная верстка. 4K
2 months ago 00:00:57 1
Новое CSS свойство field-sizing - ширина полей формы зависит от содержимого #css #javascript #html
2 months ago 00:11:13 1
❌ Не пиши CSS через запятую ✅ Используй :where()
2 months ago 00:08:57 1
Сокращай и упрощай CSS с помощью :is()
2 months ago 00:01:00 1
💻 Создание красивой анимации карусели с карточками Travel путешествий #quadd4rv1n7 #html #css #2024
2 months ago 00:35:13 1
Создание потрясающей галереи на HTML, CSS и JavaScript (CSS-анимация, Blur, Parallax, Gradient)
2 months ago 00:01:00 1
Figma • Инспектирование стилей без DevMode • Плагин Inspect Styles
2 months ago 00:00:18 1
ClientMod Android Css #60fps #clientmod
2 months ago 06:41:57 1
Курс по верстке и созданию сайтов с нуля. Все основы HTML / CSS на практике.
2 months ago 00:16:42 1
КАК ВЫЙТИ НА ФРИЛАНС В 2024 ГОДУ - KWORK l ВЕБ РАЗРАБОТКА l АРОКЕН l ВЕБ ДИЗАЙН CSS l HTML l КВОРК
2 months ago 00:57:59 1
Создание крутого 3D сайта с анимацией прокрутки (HTML CSS JavaScript)
2 months ago 00:43:27 1
Web - 24 - Адаптивная CSS верстка. Адаптация HTML страницы под экран телефона, планшета, монитора ПК
2 months ago 00:01:00 1
CSS user-invalid — псевдокласс, о котором ты не знал