Адаптивная верстка с Flexbox и Grid - вебинары ITVDN
ITVDN: курсы программирования
Видеокурсы по
программированию

Выбери свою
IT специальность

Начать бесплатно

Выбери свою IT специальность

Начать бесплатно

Адаптивная верстка с Flexbox и Grid

Все вебинары бесплатные и доступны для зарегистрированных пользователей
Ткаченко Анастасия
Frontend Developer
01.01.1960
19:00 - 21:00
Рейтинг: 5. Проголосовало: 31

Flexbox и Grid – технологии, которые широко используются в верстке сайтов и существенно упрощают задачи обеспечения адаптивности.


О технологиях:

  • CSS Flexbox (Flexible Box Layout Module) — модель макета гибкого контейнера — представляет собой способ компоновки элементов, в основе лежит идея оси. Flexbox состоит из гибкого контейнера (flex container) и гибких элементов (flex items). Гибкие элементы могут выстраиваться в строку или столбик, а оставшееся свободное пространство распределяется между ними различными способами.
  • CSS Grid Layout - система двумерного макета, оптимизированного для дизайна пользовательского интерфейса. Главная идея, лежащая в основе макета сетки, заключается в разделении веб-страницы на столбцы и строки. В образовавшиеся области сетки можно помещать элементы сетки, а управлять их размерами и расположением можно с помощью специальных свойств модуля.

В ходе вебинара будут продемонстрированы возможности  этих технологий и преимущества их комбинации на практике (в каком случае какую технологию нам необходимо использовать) для создания адаптивных страниц 


План вебинара:

1) Знакомство с технологиями Flexbox и Grid.
2) Создание desktop версии web-страницы.
3) Добавление медиа запросов на страницу для адаптивности.


Целевая аудитория:

Данный вебинар будет интересен начинающим Frontend разработчикам и верстальщикам, которые уже знакомы с основами HTML5 & CSS3.

Дмитрий Охрименко
01.01.1960
1 ч 45 м
3357
Владислав Ермолаев
01.01.1960
2 ч 44 м
3860
Тысячный Влад
01.01.1960
2 ч 4 м
6341
Виталий Емец
01.01.1960
2 ч 0 м
5276
Алла Штогрина
01.01.1960
2 ч 3 м
7950
Виталий Мазяр
01.01.1960
2 ч 14 м
6975
Алла Штогрина
01.01.1960
2 ч 2 м
5151
Генрих Коваленко
01.01.1960
1 ч 48 м
7774
Алла Штогрина
01.01.1960
1 ч 49 м
3339
Влад Шевченко
01.01.1960
2 ч 4 м
4953
Тысячный Влад
01.01.1960
1 ч 24 м
11419
Ярослав Вовченко
01.01.1960
2 ч 3 м
4481
Константин Абрамов
01.01.1960
3 ч 26 м
3759
Владимир Кожаев
01.01.1960
1 ч 6 м
3853
Артем Кондранин
01.01.1960
2 ч 14 м
3723
Елена Хижняк
01.01.1960
1 ч 24 м
6189
Евгений Волосатов
01.01.1960
2 ч 49 м
19238
Артем Кондранин
01.01.1960
2 ч 14 м
7787
Юрий Шерстобитов
01.01.1960
2 ч 20 м
6319
Патёха Сергей
01.01.1960
1 ч 21 м
14779
Евгений Волосатов
01.01.1960
1 ч 42 м
16644
Кирилл Козак
01.01.1960
2 ч 27 м
10641
Александр Пономаренко
01.01.1960
2 ч 46 м
39128
Артем Кондранин
01.01.1960
2 ч 22 м
25461
Артем Кондранин
01.01.1960
2 ч 3 м
4225
Артем Кондранин
01.01.1960
1 ч 41 м
3889
Сергей Швайцер
01.01.1960
1 ч 34 м
3364
Сергей Швайцер
01.01.1960
2 ч 0 м
2634
ТОП-10 лучших видео по FrontEnd
Друзья, сегодня мы подготовили для вас подборку лучших вебинаров от ITVDN по направлению FrontEnd. В рейтинг были включены как познавательные вебинары с актуальной информацией, так и вебинары прикладного характера, которые нацелены на совершенствование ваших навыков написания кода. Давайте приступим к их рассмотрению.
Что должен знать FrontEnd разработчик в 2021 году
Верстка сайтов и веб-программирование привлекают большое количество новичков в мир IT. Это связано с достаточно низким порогом вхождения. Количество желающих стать фронтендщиком с каждым годом увеличивается, вследствии чего растут и требования к кандидатам.
Кто такой Full-stack разработчик
Full-stack разработчик (произносится “фулл стек”) — это некий мастер на все руки в мире веб-разработки. Ему под силу реализовать как клиентскую, так и серверную сторону приложения, которыми, обычно, занимаются FrontEnd и BackEnd разработчики раздельно друг от друга. Таким образом, Full-stack специалист способен в одиночку вести проект от начала до конца.
Что должен знать FrontEnd разработчик в 2019 году
Верстка сайтов и веб-программирование привлекают большое количество новичков в мир IT. Это связано с достаточно низким порогом вхождения. Количество желающих стать фронтендщиком с каждым годом увеличивается, вследствии чего растут и требования к кандидатам.
Что такое адаптивная верстка и зачем она нужна
Еще в 2015 году Google внедрил изменения в алгоритмы своей поисковой системы, которые теперь учитывают адаптированность сайта под мобильные устройства как важный пункт при ранжировании сайта. Дата была удачно названа Мобилгеддон (Mobilegeddon), как сравнение с Армагеддоном. Одно только такое введение требований от поисковиков к наличию мобильной версии сайта может оправдать важность адаптивного дизайна. Проще говоря, веб-сайт должен быть удобным для просмотра на смартфоне.
Обзор конструкторов сайтов – критерии выбора и преимущества использования
Конструкторы сайтов представляют собой сервис по самостоятельной разработке интернет страниц. В отличие от CMS они просты в управлении, а также открывают множество возможностей настройки и опций, востребованных в современном онлайн мире.
Тренды веб-разработки на 2019 год
Готовы ли вы к внедрению инноваций в ваши веб-приложения в 2019 году? Представляем вам последние тренды веб-разработки, которым, безусловно, стоит следовать!
Инструменты Vue.js разработчика
Когда вы начинаете свои эксперименты с Vue и открываете инструменты разработчика в браузере, вы обнаружите предложение загрузить инструменты разработчика Vue.js по указанной ссылке.
Топ-5 лучших фреймворков для Python-разработчиков
Сейчас трудно представить себе любого девелопера без использования фреймворков. Здесь вы найдёте 5 лучших и наиболее признанных фреймворков для Python-разработчиков.
10 полезных фич в Angular, о которых вы могли не знать
Angular - это объемный фреймворк, и наверняка большинство из нас использует лишь небольшую его часть. Но за этим мы можем упускать некоторые весьма полезные его возможности, которые сделали бы нашу жизнь значительно проще. В этой статье я собираюсь разобрать около 12 полезных фич в Angular, о которых вы могли и не слышать.
HTML 5.2 is done, HTML 5.3 is coming
На сегодняшний день W3C уже выпустило релиз 5.2. Это второй пересмотр HTML 5, который идет сразу за HTML 5.1, увидевшего свет в прошлом году. В 2014 году мы выразили желание устраивать «ревизию» HTML каждый год. Что же, похоже, наше желание было услышано.
Лучшие практики Node.JS
Добро пожаловать в наш небольшой сборник советов от ведущих разработчиков на платформе Node.JS! Цель сей статьи – обобщить все те знания, которые были в свое время опубликованы в различных обучающих постах или журналах.

Пакеты подписки с доступом ко всем курсам и сервисам

Стартовый
  • Все видеокурсы на 3 месяца
  • Тестирование по 10 курсам
  • Проверка 5 домашних заданий
  • Консультация с тренером 30 мин
49.99 $
35.00 $
Подписка
Базовый
  • Все видеокурсы на 6 месяцев
  • Тестирование по 16 курсам
  • Проверка 10 домашних заданий
  • Консультация с тренером 60 мин
Премиум
  • Все видеокурсы на 12 месяцев
  • Тестирование по 24 курсам
  • Проверка 20 домашних заданий
  • Консультация с тренером 120 мин
комментарии и обсуждения
Notification success