/
Orpheus
/
laba1
Обзор
Документация
Войти
/
Orpheus
/
laba1
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
index.html
110 строк
6 KB
Orpheus
1лаб
09 июн 2025, 05:36
09 июн 2025, 05:36
ccea60f
Код
Авторство
О чём код?
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="keywords" content="РКСП, примеры верстки, html"> <title>Лабораторная работа №1</title> <link rel="stylesheet" href="style.css"> </head> <body> <header> <h1>Оформление текста</h1> </header> <main> <article> <p>Одна из областей, от которых типографы обычно стараются держаться подальше, - это дизайн бланков и форм. Проектировать их непросто, так что это - вызов вашему мастерству. Но вознаграждение не заставит себя ждать в смысле профессионального роста.</p> <p>Выберите шрифт, чуть более узкий, чем используете обычно. Бланки и формы постоянно копируются, так что убедитесь в том, что шрифт хорошо читается, имеет приличное жирное начертание для выделения текста и различимые цифры.</p> <p>Чётко отделите напечатанный текст от полей, которые подлежат заполнению. Линейки и отточия должны служить направляющими для рукописного заполнения формы, а не выглядеть, как решётка тюремного окна. То же самое относится к рамкам вокруг текста. Так ли они необходимы? Не бойтесь, буквы не разбегутся!</p> <p>Без ограничительных рамок формы выглядят вполовину менее официальными и не так наводят на мысль о запретах. Разные поля на странице можно разделить белым пространством, как в нашем примере.</p> <p>Если какой-то шрифт был создан нейтральным, чистым и практичным, то это Univers Адриана Фрутигера, 1957. Узкие начертания гарнитуры действительно хорошо читаемы.</p> <section> <h2>Индексация Univers (Lynotype):</h2> <p>Первая цифра обозначает насыщенность:</p> <ol> <li>сверхсветлое начертание,</li> <li>тонкое и т.д. до</li> <li>сверхжирного.</li> </ol> <p>Вторая - пропорции:</p> <ul> <li>сжатое,</li> <li>узкое,</li> <li>нормальное,</li> <li>широкое начертание.</li> </ul> </section> </article> <section class="image-section"> <div class="large-image-container"> <img src=".сахур.jpg" alt="Большое изображение" class="large-image"> <img src="images/small-image1.png" alt="Маленькое изображение 1" class="small-image pos1"> <img src="images/small-image2.png" alt="Маленькое изображение 2" class="small-image pos2"> <img src="images/small-image3.png" alt="Маленькое изображение 3" class="small-image pos3"> </div> </section> <section class="contact-section"> <h2>Контакты</h2> <p>Телефон: <a href="tel:+1234567890">+1 234 567 890</a></p> <p>Email: <a href="mailto:example@domain.com">example@domain.com</a></p> </section> <section class="form-section"> <h2>Форма регистрации</h2> <form id="registration-form"> <div class="form-group"> <label for="name">Имя:</label> <input type="text" id="name" name="name" required> </div> <div class="form-group"> <label for="email">Email:</label> <input type="email" id="email" name="email" required> </div> <div class="form-group"> <label for="password">Пароль:</label> <input type="password" id="password" name="password" required> </div> <div class="form-group"> <label for="birthdate">Дата рождения:</label> <input type="date" id="birthdate" name="birthdate"> </div> <div class="form-group"> <label for="gender">Пол:</label> <select id="gender" name="gender"> <option value="male">Мужской</option> <option value="female">Женский</option> <option value="other">Другой</option> </select> </div> <div class="form-group checkbox-group"> <input type="checkbox" id="subscribe" name="subscribe"> <label for="subscribe">Подписаться на рассылку</label> </div> <button type="submit" class="submit-btn">Зарегистрироваться</button> </form> </section> </main> <footer> <p>© 2025 Лабораторная работа №1</p> </footer> <script src="javascript.js"></script> </body> </html>