Задание
1. Создать html файл главной страницы вашего сайта (визуальный шаблон см. в
отдельном файле).
2. Создать таблицу стилей вашего сайта и подключить ее к главной странице.
3. Создать основную структуру сайта.
4. Заполните сайт текстовой информацией (хотя бы частично). Рисунки, фон,
градиенты и прочий визуальный контент нет необходимости добавлять на этой
стадии, он будет добавлен позже.
5. Создать область навигации (вверху и внизу страницы).
6. Добавить еще несколько (не менее 3-х) страниц на сайт.
7. Создать гиперссылки для навигации между страницами сайта.
8. Присвойте свойству box-sizing значение border-box.
9. Установите необходимые размеры и отступы блоков вашего сайта согласно
индивидуальному визуальному шаблону.
10. Осуществите позиционирование содержимого сайта, т.е. создайте макет как
главной, так и остальных страниц сайта. При этом в разных частях сайта
необходимо воспользоваться основными тремя технологиями: через inline-
block, через float и с использованием flexbox.
Лабораторная работа No 2-1
Задание
1. В вашем проекте, созданном в предыдущей лабораторной работе, измените
свойства шрифтов на необходимые. Установите необходимый размер шрифта,
высоту строки, начертание, цвет.
2. Примените к тексту, там, где это необходимо, такие свойства как text-decoration,
text-transform, letter-spacing.
3. Встройте минимум два веб-шрифта в ваш проект. Один, из которых, должен
встраиваться как локальный шрифт, а второй подключаться по ссылке с сайта
https://fonts.google.com.
4. Добавьте фон, а также градиент к страницам вашего сайта в тех местах, где это
необходимо.
Лабораторная работа No 3
Задание
1. В вашем проекте, созданном в предыдущих лабораторных работах, создайте
минимум два списка, один из которых должен быть нумерованным, а второй
маркированным. При необходимости добавьте в проект страницы и текстовый
контент для создания списков. Необходимо уметь изменять маркеры, нумерацию в
списках.
2. Добавьте в ваш проект изображения, а также фоновые картинки.
3. На отдельной странице вашего сайта добавьте мультимедийный контент: аудио и
видео, которые расположены локально в файловой системе сайта.
4. Добавьте в ваш проект страницу «О нас», на которой разместите необходимый текст
с контактной информацией, также два элемента <iframe> - ролик с youtube и карту с
Google Maps.
Лабораторная работа No 4-1
Задание
1. В вашем проекте, созданном в предыдущих лабораторных работах, добавьте новую
страницу (сохраняя общий стиль сайта!), на которой разместите табличную
информацию (прайс лист, каталог товаров и пр.).
2. Добавьте в меню навигации сайта пункт с ссылкой, ведущей на страницу с таблицей.
3. Таблица должна состоять минимум из 10 строк и 5 столбцов! Также она должна
содержать все типичные элементы: заголовок, шапку, тело и подвал (<caption>,
<thead>, <tbody> и <tfoot>).
4. В таблице должны быть объединения ячеек как по строкам, так и по столбцам (для
этого необходимо разработать соответствующую структуру).
5. Таблица должна быть стилизована для удобного восприятия табличной
информации.
Лабораторная работа No 5
Задание
1. В вашем проекте, созданном в предыдущих лабораторных работах, добавьте новую
страницу (сохраняя общий стиль сайта!), на которой разместите web-форму.
2. На форме должны быть текстовые поля и текстовые области, переключатели,
флажки, списки, а также кнопки.
3. Форма должна иметь не менее пяти элементов управления.
4. Элементы формы должны быть организованы с помощью <label>, <fieldset> и
<legend>.
5. Создайте необходимые подсказки для элементов управления с помощью атрибута
placeholder. Используйте атрибут required для проверки заполнения полей перед
отправкой формы на сервер.
Использовать только html+css , Пример дизайна на скриншоте , не обязательно точь в точь копировать каждую картинку и надписи , все картинки и прочее на сайте на ваше усмотрение , но чтобы сохранялся общий стиль . Нужно несколько страничек . Требования указаны выше
