Верстаем landing page на HTML5

Урок 1. Верстаем landing page на HTML5. Часть 1

Темы урока: * **vs code** – пару слов о редакторе кода; * **adobe assets** – Фотошоп не нужен; * **emmet** – ускоряем написание HTML-разметки; * **HTML5** – где применять section, header, nav и другие новые теги; * **normalize.css** – нормализация стилей; * **Google fonts** – подключение сторонних шрифтов; * **vh** – единицы измерения; * **display flex** – как центрировать элементы.

Урок 2. Верстаем landing page на HTML5. Часть 2

Темы урока * less в редакторе vs code, * меню на flex, два варианта: only css, with js, * списки на flex, * использование ссылок-якорей.

Урок 3. Верстаем landing page на HTML5. Часть 3

На третьем уроке речь пойдет о: * live reload в vscode, * верстаем блоки на flex, * центрирование фоновых изображений, * разница между списками в html: ul(ol) и dl, * позиционирование текста поверх изображений.

HTML5

CSS3

adobe assets

Google fonts

Emmet

Подключение сторонних шрифтов Google fonts

Работа с adobe assets

Ускоренное написание HTML-разметки с помощью emmet

Нормализация CSS при помощи Normalize.css

Верстка блоков на flex

Использование ссылок-якорей

Центрирование фоновых изображений

Позиционирование текста поверх изображений