/
irgegh2
/
web2
Обзор
Документация
Войти
/
irgegh2
/
web2
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
main
form.html
129 строк
8 KB
irgegh2
laba9
31 мар 2026, 13:14
31 мар 2026, 13:14
be37074
Код
Авторство
О чём код?
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Регистрация — Магазин одежды</title> <link rel="stylesheet" href="./css/normalize.css"> <link rel="stylesheet" href="./css/style.css"> </head> <body> <div class="wrapper"> <header class="header"> <div class="header__top"> <a class="brand" href="./index.html" aria-label="На главную">Магазин одежды</a> <nav class="header__nav" aria-label="Навигация"> <a class="chip" href="./index.html#hity-sezona">Каталог</a> <a class="chip" href="./form.html">Регистрация</a> <a class="chip" href="./demo.html">Демо</a> <a class="chip" href="tel:+79990000000">Позвонить</a> <a class="chip" href="mailto:shop@example.com">Написать</a> </nav> </div> <p class="header__meta">Регистрация и обратная связь. Ссылка на главную находится в шапке.</p> </header> <main class="page"> <section class="page__section" aria-labelledby="registration"> <h1 class="page__title" id="registration">Регистрация</h1> <p class="page__text"> Заполни форму, и мы свяжемся с тобой в выбранный интервал. </p> <form class="form" action="https://httpbin.org/post" method="post"> <fieldset class="form__group"> <legend class="form__legend">Личная информация</legend> <div class="form__grid"> <div class="field"> <label class="field__label" for="name">Имя</label> <input class="field__control" id="name" name="name" type="text" placeholder="Например: Анна" autocomplete="given-name" required> </div> <div class="field"> <label class="field__label" for="birthdate">Дата рождения</label> <input class="field__control" id="birthdate" name="birthdate" type="date"> </div> <div class="field field--full"> <span class="field__label" id="gender-label">Пол</span> <div class="field__row" role="radiogroup" aria-labelledby="gender-label"> <label class="choice"> <input class="choice__control" type="radio" name="gender" value="female" required> <span class="choice__text">Женский</span> </label> <label class="choice"> <input class="choice__control" type="radio" name="gender" value="male"> <span class="choice__text">Мужской</span> </label> </div> </div> <div class="field"> <label class="field__label" for="password">Пароль</label> <input class="field__control" id="password" name="password" type="password" placeholder="Минимум 8 символов" autocomplete="new-password" minlength="8" required> </div> <div class="field"> <label class="field__label" for="contact-time">Удобный интервал для связи</label> <select class="field__control" id="contact-time" name="contact_time" required> <option value="" selected disabled>Выбери интервал</option> <option value="morning">Утро</option> <option value="day">День</option> <option value="evening">Вечер</option> <option value="night">Ночь</option> </select> </div> </div> </fieldset> <fieldset class="form__group"> <legend class="form__legend">Контактные данные</legend> <div class="form__grid"> <div class="field"> <label class="field__label" for="email">Email</label> <input class="field__control" id="email" name="email" type="email" placeholder="name@example.com" autocomplete="email" required> </div> <div class="field"> <label class="field__label" for="phone">Телефон</label> <input class="field__control" id="phone" name="phone" type="tel" placeholder="+7 (999) 000-00-00" autocomplete="tel" required> </div> <div class="field field--full"> <label class="choice choice--agree"> <input class="choice__control" type="checkbox" name="agree" required> <span class="choice__text">Согласен(а) на обработку данных</span> </label> </div> </div> </fieldset> <div class="form__actions"> <button class="button button--primary" type="submit">Зарегистрироваться</button> <a class="button button--link" href="./index.html">На главную</a> </div> </form> </section> <section class="page__section" aria-labelledby="pseudo"> <h2 class="section-title" id="pseudo">Псевдоэлементы</h2> <ul class="pseudo-list"> <li><code>::selection</code></li> <li><code>::placeholder</code></li> <li><code>::marker</code></li> <li><code>::first-letter</code></li> <li><code>::first-line</code></li> <li><code>::before</code> и <code>::after</code></li> </ul> </section> </main> <footer class="footer"> <div class="footer__grid"> <div class="footer__block"> <p class="footer__title">Контакты</p> <a class="footer__link" href="tel:+79990000000">+7 (999) 000-00-00</a> <a class="footer__link" href="mailto:shop@example.com">shop@example.com</a> </div> <div class="footer__block"> <p class="footer__title">Адрес</p> <p class="footer__text">Москва, ул. Примерная, 1</p> <p class="footer__text">Ежедневно 10:00–21:00</p> </div> </div> </footer> </div> </body> </html>