safiiam/html-css

Основы веб-верстки

HTML-CSS

Основы веб-верстки

Основы веб-верстки HTML/CSS Урок 2. Семинар. Введение и Основы HTML

1. Скачать и настроить редактор кода, если этого не сделали на семинаре.

2. Создать пустую папку, придумать название.

3. Создать первую html страницу (index.html).

4. Добавить структуру html документа.

5. Добавить меню сайта (Меню сайта должно быть на каждой странице, оно должно быть одинаковым): a. Главная b. Каталог c. Контакты

6. Создать заголовок h1 с текстом “Главная страница”.

7. Добавить параграф p с произвольным текстом (lorem) (используем расширение emmet уже установленное в vsc, для этого вводим lorem и нажимаем клавишу tab).

8. Создать подзаголовок h2 с текстом “Добро пожаловать на сайт”.

9. Добавить три параграф p с произвольным текстом (lorem).

10. Cоздать файл catalog.html.

11. На странице “каталог” добавить структуру html-документа.

12. Добавить меню сайта (такое же как на главной странице).

13. Добавить Заголовок h1 с текстом “Каталог”.

14. Создать параграф p с произвольным текстом из 150 слов для этого вводим “lorem150” и нажимаем tab.

15. Сделать переходы с главной страницы на страницу каталог, при нажатии на меню сайта и переход со страницы каталог на главную страницу.

16. Создать папку img и разместить ее рядом с index.html.

17. Добавить в папку img произвольные фотографии товаров, по вашей тематике можно выбрать любое фото https://www.freepik.com/search?format=search&orientation=portrait&query=products

18. На странице “Каталог” после заголовка h1 и параграфа p добавить a. Изображение товара b. Название товара c. Описание товара