Ссылки и формы

Цель: изучить теги, атрибуты и их значения для ссылок и форм, получить навыки создания и оформления форм.

Порядок выполнения лабораторной работы:

Изучить:
- варианты ссылок (mailto, tel), их атрибуты, состояния и стилизацию
- теги для создания (form) и структурирования (fieldset, legend) форм, методы GET и POST
- теги для создания полей ввода, множественного выбора, их атрибуты и значения
- создание обязательных полей, их отключение и отключение кнопок
Для выполнения работы необходимо в index.html:
- в index.html корректно сделать ссылки в соответствии с содержимым и создать и стилизовать формы в соответствии с графическим макетом
- в index.html в навигацию добавить ссылку “Форма” на файл form.html
В файл form.html:
- создать в папке проекта от 5-й лабораторной новый документ - form.html
- в созданный документ скопировать header и footer из основного документа (index.html)
- в header должна быть работающая ссылка на index.html
- footer прибить к нижней части области просмотра
- переиспользовать стили от основной страницы
В основную часть документа (main) form.html:
- создать форму регистрации нового пользователя со следующими полями:
- имя,
- дата рождения,
- пол,
- пароль,
- email,
- телефон,
- удобный интервал для связи (утро, день, вечер, ночь);
Требования к форме:
- использовать типы полей соответствующие вводимым данным, добавить placeholder’ы с образцами ввода данных и связанные ярлыки (label);
- часть полей сделать обязательными для заполнения;
- поля формы объединить в две группы: личная информация и контактные данные;
- для отправки данных формы использовать метод POST;
- в качестве action использовать “//httpbin.org/post”;
- к форме добавить кнопки для отправки данных и ее сброса. В кнопках использовать текст и подходящие иконки;
Зафиксировать результаты работы с помощью системы контроля версий git и отправить репозиторий на github.
Загрузить проект на сервер через sftp или используя ssh.

Требования к html и css:

Удобочитаемый код (Руководство по оформлению HTML/CSS кода от Google);
Код отформатирован;
Корректное использование тегов;
Корректно выбранные форматы изображений;
Отсутствие ошибок на валидаторе для html и css.

Результаты выполнения лабораторной работы:

Результаты работы проверены наставником.

Статическая веб-страница, сгенерированная с помощью команды npm run build, на хостинге проверенная, со структурой и оформлением, которая соответствует требованиям и сохранена в системе контроля версий.