Видео уроки бесплатн…

Вёрстка сайта на Grid. Быстрый старт

Вёрстка сайта на Grid. Быстрый старт

Видео-курс по созданию сайтов своими руками Дениса Булыги под названием „Вёрстка сайта на Grid. Быстрый старт“ с канала WebForMySelf.
В этом цикле уроков адаптивной вёрстки автор курса покажет вёрстку PSD-макета с использованием современных Web-технологий на чистом HTML и CSS без применения препроцессоров, средств автоматизации и других каких-либо дополнительных возможностей.
Макет, в целом, является довольно простым. На его примере мы разберём множество современных возможностей. А именно, при вёрстке данного макета сайта мы будем использовать Flexbox и CSS Grid Layout.

Для каждого элемента будут использоваться плавные эффекты при наведении. Создадим CSS-анимацию, реализуем плавный переход при клике на анимированную стрелку. Для социальных иконок в подвале будем использовать SVG-спрайт. И немного времени уделим доступности.
Все эти возможности будут реализованы только на основе HTML и CSS. То есть, никаких сборок, проектов, автоматизаций, препроцессоров и прочего применяться в этом миникурсе не будет.
Давайте начинать…

Содержание видео-курса „Вёрстка сайта на Grid. Быстрый старт“:

  1. Подготовка к вёрстке
  2. HTML-разметка для шапки сайта
  3. Стилизация шапки сайта
  4. Адаптивность шапки сайта
  5. Разметка для блока контента
  6. Стилизация блока с контентом
  7. Адаптивность блока с контентом
  8. Полная вёрстка блока Instagram
  9. Вёрстка подвала


Продолжительность: 01:51:50
Год: 2019
Страна: Россия
Язык: русский