Обучающее видео

SmartGrid 2. Продвинутая вёрстка (2019)

SmartGrid 2. Продвинутая вёрстка

Бесит адаптивная вёрстка? Дизайнеры, требующие соблюдения сетки? Bootstrap, когда из-за его классов становился не виден остальной HTML-код? Тогда посмотрите данный курс и вы узнаете что такое удобная вёрстка. Новый способ, которому автор хочет вас научить, использует в себе всю мощь современных технологий: flexbox и функция calc из CSS3, один из препроцессоров на выбор (LESS, SCSS, SASS, Stylus), сборщик проектов gulp и пара его чудесных плагинов. Всё это даёт невероятный прирост в скорости и качестве вёрстки.

Содержание:

1. Урок

  • Основы Flexbox
  • Основная и вспомогательная оси
  • Лёгкие вертикальные выравнивания
  • Адаптивка без media-запросов
  • Определение размера элементов

2. Урок

  • Разбор домашних работ
  • Прокачивание мастерства Flexbox
  • Тонкости адаптивных реализаций
  • Всевозможные выравнивания
  • Слабости flexbox без media

3. Урок

  • Node.js и NPM — основы магии
  • Gulp — сборка проекта
  • LESS — генератор CSS
  • Group CSS Media Queries
  • Autoprefixer — кроссбраузерность

4. Урок

  • Основы CSS-препроцессоров
  • Иерархическое написание
  • Переменные и примеси
  • Написание кода на LESS
  • Написание кода на SASS (SCSS)

5. Урок

  • Основы создания сетки
  • Отступы в px или в %
  • Margin и padding варианты
  • npm i smartgrid — поехали!
  • Настройка свойств сетки

6. Урок

  • Вёрстка макета
  • Оптимизация кода
  • Иерархия селекторов vs BEM
  • Дополнительные приёмы вёрстки
  • Наслаждение результатом
SmartGrid 2. Продвинутая вёрстка1

SmartGrid 2. Продвинутая вёрстка2

Автор: Дмитрий Лаврик
Язык: русский
Продолжительность: ~13 часов

Формат: MP4 (+доп. файлы)
Видео: AVC, 1920x1080, ~354 Kbps
Аудио: AAC, 126 Kbps, 48.0 KHz

 

Скачать обучающее видео "SmartGrid 2. Продвинутая вёрстка" (2,96 ГБ):

tottall 20/06/19 Просмотров: 1887
0