03.03.2026

HTML-код для веб-страниц

На чтение
11 мин
Дата обновления
01.03.2026
HTML (HyperText Markup Language) является основным языком, используемым для создания веб-страниц. Этот язык позволяет определять структуру и содержание документа, а также взаимодействие с элементами на странице. Разработчики веб-сайтов используют HTML для создания элементов страницы, таких как текст, изображения, гиперссылки и другие интерактивные элементы. HTML не является языком программирования в строгом смысле; это язык разметки, который определяет структуру документа. Однако понимание HTML является важным навыком для веб-разработчиков и дизайнеров, поскольку это основа для создания веб-страниц.

Основы HTML и структура веб-страниц

HTML-страница состоит из набора элементов, каждый из которых имеет свою роль и значение. Основу веб-страницы составляют следующие элементы:
  • Тег : Этот тег указывает браузеру на версию HTML, которую следует использовать для отображения страницы.
  • Тег : Определяет начало и конец HTML-документа.
  • Тег : Содержит метаинформацию о документе, такую как заголовок страницы, ссылки на стили и скрипты.
  • Тег : Устанавливает заголовок документа, который отображается во вкладке браузера или на веб-странице.</li> <li>Тег <body>: Определяет содержимое документа, отображаемое на странице.</li> <li>Теги <h1>, <h2>, ..., <h6>: Заголовки различного уровня, определяющие важность и структуру текста.</li> <li>Тег <p>: Используется для оформления текста в абзацы.</li> <li>Тег <a>: Создает гиперссылки на другие страницы или ресурсы.</li> <li>Тег <img>: Вставляет изображения на страницу.</li> </ul> <h2>Теги и их использование</h2><img src="/2025/12/html-kod-dlya-veb-stranits-39951.jpg" alt="HTML-код для веб-страниц"> HTML содержит множество тегов, каждый из которых выполняет определенную функцию. Некоторые основные теги и их использование: <p>Тег <div>: Этот тег используется для создания блока или контейнера, который позволяет группировать элементы на странице. Он может быть стилизован с помощью CSS для оформления внешнего вида.</p> <table> <tr> <th>Тег</th> <th>Описание</th> </tr> <tr> <td><div></td> <td>Создает блочный элемент для группировки других элементов</td> </tr> <tr> <td><span></td> <td>Создает строчный элемент для стилизации части текста</td> </tr> <tr> <td><table></td> <td>Создает таблицу на странице</td> </tr> </table> <p>Тег <span>: Этот тег используется для выделения части текста с целью применения стилей или скриптов. В отличие от <div>, <span> – строчный элемент.</p> HTML позволяет создавать динамичные и интерактивные веб-страницы, используя различные теги и их комбинации. Изучение и понимание основ HTML является важным этапом для всех, кто стремится создавать высококачественные и креативные веб-сайты.<h2>Верстка и дизайн веб-страниц</h2> <p>HTML-код для веб-страниц играет ключевую роль в создании самой основы веб-страницы. Верстка веб-страниц включает в себя создание структуры документа, оформление текста, размещение изображений и других элементов. Профессионалы, занимающиеся этой сферой, должны иметь навыки работы с HTML, CSS, а также знание основ веб-дизайна и пользовательского опыта.</p> <aside class="article__header-linkbanner mb40"><a class="linkbanner bg_lightviol" href="https://designersearch.ru/blog/vyerstka/css-blochnaya-model/"><div class="linkbanner__img"><picture><source type="image/webp" srcset="/2025/12/css-blochnaya-model-03892.jpg" width="400" height="225"><img src="/2025/12/css-blochnaya-model-03892.jpg" alt="" width="400" height="225"></picture></div><div class="linkbanner__body"><div class="linkbanner__uptitle f20 f16-mob lh15 mb10 color_viol">Читайте также</div><div class="linkbanner__title f30 f20-mob lh105">CSS блочная модель</div></div></a></aside> <p>Работа верстальщика начинается с создания корректной и удобочитаемой структуры HTML-документа. Важно учитывать семантическую правильность элементов, чтобы обеспечить доступность и удобство использования веб-страницы для всех пользователей, включая людей с ограниченными возможностями. Код должен быть чистым, понятным и легко поддерживаемым.</p> <p>Следующим важным аспектом работы верстальщика является стилизация содержимого с помощью CSS. Здесь необходимо умение создавать красивый и современный дизайн, который будет соответствовать целям заказчика и ожиданиям пользователей. Владение CSS позволяет управлять внешним видом элементов, их расположением на странице, анимациями и переходами.</p> <p>Одной из ключевых задач верстальщика является адаптивная верстка. С учетом разнообразия устройств, на которых могут просматриваться веб-страницы, необходимо создавать адаптивный дизайн, который будет корректно отображаться на мобильных устройствах, планшетах и десктопах. Это требует умения писать медиазапросы и использовать flexbox и grid для создания адаптивных макетов.</p> <p><blockquote>«HTML - это каркас, CSS - это оформление, JS - это живость. HTML и CSS являются основами для любого веб-разработчика, и владение этими инструментами позволяет создавать привлекательные и функциональные веб-страницы». - Неизвестный автор</blockquote></p> <h2>Работа с изображениями</h2><img src="/2025/12/sozdanie-html-stranits-3278.jpg" alt="HTML-код для веб-страниц"> <p>Одной из важных задач верстальщика веб-страниц является работа с изображениями. Изображения играют важную роль в создании визуального контента, который привлекает внимание пользователей и улучшает пользовательский опыт. Правильная работа с изображениями помогает ускорить загрузку страницы, оптимизировать ее для поисковых систем и добиваться красивого отображения на всех устройствах.</p> <p>Оптимизация изображений - один из ключевых аспектов работы с изображениями. Оптимизированные изображения занимают меньше места и загружаются быстрее, что положительно сказывается на производительности веб-страницы. Для этого используются специальные инструменты для сжатия изображений без потери качества, выбора правильных форматов файлов (например, JPEG, PNG, SVG) и установки правильного размера изображений для различных устройств.</p> <p>Ретинизация изображений - еще один важный аспект работы с изображениями. Ретинизация позволяет улучшить отображение изображений на устройствах с высоким разрешением (Retina-дисплеи). Для этого необходимо создавать дополнительные варианты изображений с увеличенным разрешением (например, с использованием тега srcset в HTML) для сохранения четкости изображений.</p> <p>Также важно уметь работать с CSS-свойством background-image, которое позволяет добавлять фоновые изображения к элементам страницы. Это часто используется для создания эффектов, декоративных элементов и фоновых текстур. Знание возможностей CSS в работе с изображениями помогает улучшить визуальный дизайн страницы и привлечь внимание пользователей.</p><h2>HTML-код для веб-страниц</h2> <p>HTML (HyperText Markup Language) является основой для создания веб-страниц, определяющей структуру и содержимое документа. HTML-код для веб-страниц играет важную роль в создании интерактивных и информативных сайтов.</p> <h2>Формы и элементы управления</h2> <p>Формы являются одним из наиболее важных элементов веб-страниц, позволяющих пользователям взаимодействовать с сайтом. Рассмотрим основные элементы управления, которые можно использовать при создании форм в HTML:</p> <ul> <li><strong>Input:</strong> элемент для ввода данных, таких как текст, числа, даты и другие.</li> <li><strong>Textarea:</strong> область для ввода многострочного текста.</li> <li><strong>Select:</strong> выпадающий список для выбора одного или нескольких вариантов.</li> <li><strong>Button:</strong> кнопка для отправки формы либо выполнения других действий.</li> <li><strong>Checkbox и Radio:</strong> элементы для выбора из нескольких вариантов.</li> </ul> <h2>Адаптивная верстка и мобильное разработка</h2> <p>Одним из ключевых трендов веб-разработки является создание адаптивных веб-сайтов, которые корректно отображаются на различных устройствах: от мобильных телефонов до настольных компьютеров. Для этого используются следующие подходы и технологии:</p> <p><strong>1. Медиа-запросы:</strong> CSS-технология, позволяющая адаптировать стили в зависимости от ширины экрана устройства. Это позволяет создать разные варианты отображения для мобильных устройств, планшетов и десктопов.</p> <p><strong>2. Гибкая сетка:</strong> использование процентных или относительных единиц измерения для компоновки элементов на странице, что позволяет им масштабироваться в зависимости от размеров экрана.</p> <p><strong>3. Изображения под разные разрешения:</strong> используя теги <img> с атрибутом srcset, можно загружать разные версии изображений в зависимости от плотности пикселей экрана.</p> <p><strong>4. Мобильное меню:</strong> часто применяется <blockquote>гамбургер-меню</blockquote> – иконка, при нажатии на которую открывается боковое или выпадающее меню, оптимизированное для мобильных устройств.</p> <p>Адаптивная верстка и мобильное разработка становятся все более актуальными с распространением мобильных устройств и разнообразием их экранов. Овладение HTML позволяет создавать гибкие и удобные веб-страницы, а знание основных элементов управления и технологий адаптивной верстки помогает развивать современные и функциональные веб-приложения.</p><h2>SEO и оптимизация веб-страниц</h2> <p>HTML-код для веб-страниц является важной частью процесса создания и оформления интернет-ресурсов. При разработке веб-страниц не менее важно уделить внимание аспектам SEO (Search Engine Optimization) и оптимизации для поисковых систем. SEO-оптимизация помогает улучшить видимость веб-страниц в результатах поиска, что в свою очередь может привести к увеличению трафика и посещаемости сайта. Важно понимать, что хорошо спроектированный HTML-код может иметь прямое влияние на SEO-показатели веб-страницы.</p> <p>Одним из основных аспектов SEO является правильное использование HTML-тегов. Например, использование тега <title> в заголовке страницы позволяет поисковым системам понять о чем сайт и повысить его рейтинг. Кроме того, правильное использование мета-тегов для описания содержимого страницы и ключевых слов помогает оптимизировать веб-страницу для поисковых запросов пользователей.</p> <p>Другим важным аспектом SEO-оптимизации является скорость загрузки веб-страницы. Оптимизированный HTML-код поможет ускорить загрузку страницы, что имеет важное значение для пользователя и влияет на её ранжирование в поисковых системах. Поэтому при разработке HTML-кода важно учитывать не только внешний вид страницы, но и её производительность.</p> <h2>Заключение</h2> <p>В заключение, HTML-код для веб-страниц играет ключевую роль в создании интерактивного и оптимизированного контента для интернет-пользователей. Понимание принципов SEO и оптимизации веб-страниц позволяет создавать не только красивые, но и эффективные сайты, привлекающие большую аудиторию.</p> <p>Важно помнить, что разработка HTML-кода - это процесс, требующий внимания к деталям и постоянного обновления знаний в области веб-разработки и SEO. Овладение этими навыками позволит создавать высококачественные веб-страницы, соответствующие современным требованиям и ожиданиям пользователей и поисковых систем.</p> <p>Таким образом, профессия HTML-разработчика для веб-страниц является важной и перспективной областью труда, требующей не только технических навыков, но и понимания основ SEO и оптимизации для успешного продвижения веб-проектов в онлайн среде.</p><h2>FAQ</h2> <h3>1. Что такое HTML?</h3> <p>HTML (HyperText Markup Language) - это стандартный язык разметки для создания веб-страниц. С помощью HTML можно определить структуру и содержимое документа, включая текст, изображения, ссылки и другие элементы.</p> <h3>2. Как создать веб-страницу с использованием HTML?</h3> <p>Для создания веб-страницы с использованием HTML необходимо написать текстовый документ, используя специальные теги и атрибуты. После сохранения этого документа с расширением .html или .htm он может быть открыт в веб-браузере.</p> <h3>3. Какова основная структура HTML-документа?</h3> <p>Основная структура HTML-документа содержит элементы, такие как <!DOCTYPE html>, <html>, <head> и <body>. <!DOCTYPE html> указывает браузеру, какая версия HTML используется, <html> обозначает начало и конец документа, <head> содержит заголовок страницы, а <body> - содержимое страницы.</p> <h3>4. Как добавить заголовок на веб-страницу с помощью HTML?</h3> <p>Для добавления заголовка на веб-страницу используется тег <h1>-<h6>, где <h1> - это самый большой заголовок, а <h6> - самый маленький. Например, <h1>Заголовок</h1>.</p> <h3>5. Что такое теги и атрибуты в HTML?</h3> <p>Теги - это элементы языка разметки HTML, которые определяют структуру документа. Атрибуты предоставляют дополнительную информацию о тегах. Например, <a href=<blockquote>https://www.example.com</blockquote>>Ссылка</a>, где href - атрибут, указывающий адрес URL.</p> <h3>6. Как добавить изображение на веб-страницу с использованием HTML?</h3> <p>Для добавления изображения на веб-страницу используется тег <img> с атрибутом src, указывающим путь к файлу изображения. Например, <img src=<blockquote>image.jpg</blockquote> alt=<blockquote>Описание изображения</blockquote>>.</p> <h3>7. Как создать гиперссылку на другую веб-страницу с помощью HTML?</h3> <p>Для создания гиперссылки используется тег <a> с атрибутом href, указывающим URL целевой страницы. Например, <a href=<blockquote>https://www.example.com</blockquote>>Ссылка на другую страницу</a>.</p><div class="article-footer"><div class="tags"><a href="/blog/veb-razrabotka/">Веб-разработка</a></div><div class="blog-share"><span>Поделиться:</span><a href="https://vk.com/share.php?url=https%3A%2F%2Fdesignersearch.ru%2Fblog%2Fveb-razrabotka%2Fhtml-kod-dlya-veb-stranits%2F&title=HTML-%D0%BA%D0%BE%D0%B4%20%D0%B4%D0%BB%D1%8F%20%D0%B2%D0%B5%D0%B1-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86&utm_source=share2" rel="nofollow noopener" target="_blank"><i class="fab fa-vk"></i></a><a href="https://t.me/share/url?url=https%3A%2F%2Fdesignersearch.ru%2Fblog%2Fveb-razrabotka%2Fhtml-kod-dlya-veb-stranits%2F&text=HTML-%D0%BA%D0%BE%D0%B4%20%D0%B4%D0%BB%D1%8F%20%D0%B2%D0%B5%D0%B1-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86&utm_source=share2" rel="nofollow noopener" target="_blank"><i class="fab fa-telegram"></i></a><a href="viber://forward?text=HTML-%D0%BA%D0%BE%D0%B4%20%D0%B4%D0%BB%D1%8F%20%D0%B2%D0%B5%D0%B1-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%20https%3A%2F%2Fdesignersearch.ru%2Fblog%2Fveb-razrabotka%2Fhtml-kod-dlya-veb-stranits%2F&utm_source=share2" rel="nofollow" target="_blank"><i class="fab fa-viber"></i></a><a href="https://api.whatsapp.com/send?text=HTML-%D0%BA%D0%BE%D0%B4%20%D0%B4%D0%BB%D1%8F%20%D0%B2%D0%B5%D0%B1-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%20https%3A%2F%2Fdesignersearch.ru%2Fblog%2Fveb-razrabotka%2Fhtml-kod-dlya-veb-stranits%2F&utm_source=share2" rel="nofollow noopener" target="_blank"><i class="fab fa-whatsapp"></i></a></div></div></div></div><div class="pane related-posts"><h4 class="decored-title">Похожие статьи</h4><div class="row"><div class="col-lg-4 mb-4 mb-lg-0"><div class="post-preview"><div class="post-preview-cover"><a href="/blog/veb-razrabotka/frontend-i-backend/"><img src="/upload/iblock/188/t9kdbnqu4en7o0vkys8zjuq9k03he3rh/frontend-i-backend-99661.jpg"></a></div><div class="post-preview-title"><a href="/blog/veb-razrabotka/frontend-i-backend/">HTML-код для веб-страниц</a></div><span>03.03.2026</span></div></div><div class="col-lg-4 mb-4 mb-lg-0"><div class="post-preview"><div class="post-preview-cover"><a href="/blog/veb-razrabotka/html-kod-dlya-veb-stranits/"><img src="/upload/iblock/663/rkfhoz0wpqgjys6sfdg1cy2ba2hrfr1u/html-kod-dlya-veb-stranits-39965.jpg"></a></div><div class="post-preview-title"><a href="/blog/veb-razrabotka/html-kod-dlya-veb-stranits/">HTML-код для веб-страниц</a></div><span>03.03.2026</span></div></div><div class="col-lg-4 mb-4 mb-lg-0"><div class="post-preview"><div class="post-preview-cover"><a href="/blog/veb-razrabotka/php-freymvork-i-ego-otlichie/"><img src="/upload/iblock/414/7wftlux7avwl8nbvgq5szsuqcmynanmd/php-freymvork-i-ego-otlichie-29770.jpg"></a></div><div class="post-preview-title"><a href="/blog/veb-razrabotka/php-freymvork-i-ego-otlichie/">HTML-код для веб-страниц</a></div><span>03.03.2026</span></div></div></div></div></div><div class="sidebar"><div class="widget"><h3>Популярные статьи</h3><div class="wiget-grp"><div class="post-tmb"><div class="post-tmb-img"><img src="/upload/iblock/c3b/6mjla2l6zrexofov1hh69yvynbbq7u2w/sap-spetsialisty-i-ih-rol-77375.jpg"/></div><div class="post-tmb-cnt"><div class="post-tmb-title"><a href="/blog/it-spetsialisty/sap-spetsialisty-i-ih-rol/">SAP-специалисты и их роль</a></div><div class="post-tmb-title">5 марта 2026 г.</div></div></div><div class="post-tmb"><div class="post-tmb-img"><img src="/upload/iblock/d28/u5ffxdlmk1qpzaisaau9y0ol0whhcbzo/25-testov-dlya-sobesedovaniya-82347.jpg"/></div><div class="post-tmb-cnt"><div class="post-tmb-title"><a href="/blog/obrazovanie/25-testov-dlya-sobesedovaniya/">25 тестов для собеседования</a></div><div class="post-tmb-title">6 марта 2026 г.</div></div></div></div></div><div class="widget"><h3>Категории</h3><ul class="cat-nav"><li><a href="/blog/administrativnyy-personal/">Административный персонал</a></li><li><a href="/blog/analitika/">Аналитика</a></li><li><a href="/blog/analitika-dannyh/">Аналитика данных</a></li><li><a href="/blog/vvedenie/">Введение</a></li><li><a href="/blog/veb-razrabotka/">Веб-разработка</a></li><li><a href="/blog/vyerstka/">Вёрстка</a></li><li><a href="/blog/didzhital-marketing/">Диджитал-маркетинг</a></li><li><a href="/blog/dizayn-interera/">Дизайн интерьера</a></li><li><a href="/blog/instrumenty-razrabotki/">Инструменты разработки</a></li><li><a href="/blog/internet-marketing/">Интернет-маркетинг</a></li><li><a href="/blog/informatsionnaya-bezopasnost/">Информационная безопасность</a></li><li><a href="/blog/informatsionnye-tekhnologii/">Информационные технологии</a></li><li><a href="/blog/infrastruktura/">Инфраструктура</a></li><li><a href="/blog/it-i-programmnoe-obespechenie/">ИТ и программное обеспечение</a></li><li><a href="/blog/it-spetsialisty/">ИТ-специалисты</a></li><li><a href="/blog/kadrovoe-delo/">Кадровое дело</a></li><li><a href="/blog/kadrovyy-menedzhment/">Кадровый менеджмент</a></li><li><a href="/blog/kadry">Кадры</a></li><li><a href="/blog/karjera/">Карьера</a></li><li><a href="/blog/obrazovanie/">Образование</a></li><li><a href="/blog/obuchenie-i-razvitie/">Обучение и развитие</a></li><li><a href="/blog/obshchee/">Общее</a></li><li><a href="/blog/operatsionnye-sistemy/">Операционные системы</a></li><li><a href="/blog/optimizatsiya/">Оптимизация</a></li><li><a href="/blog/osnovy-seo/">Основы SEO</a></li><li><a href="/blog/podbor-personala/">Подбор персонала</a></li><li><a href="/blog/programmnoe-obespechenie/">Программное обеспечение</a></li><li><a href="/blog/programmy/">Программы</a></li><li><a href="/blog/prodazhi/">Продажи</a></li><li><a href="/blog/prodvizhenie/">Продвижение</a></li><li><a href="/blog/produktovaya-analitika/">Продуктовая аналитика</a></li><li><a href="/blog/professii/">Профессии</a></li><li><a href="/blog/professiya-chto-eto-znachit-i-kak-vybrat/">Профессия</a></li><li><a href="/blog/psikhologiya/">Психология</a></li><li><a href="/blog/razrabotka-po/">Разработка ПО</a></li><li><a href="/blog/sotsialnye-seti/">Социальные сети</a></li><li><a href="/blog/stati/">Статьи</a></li><li><a href="/blog/taym-menedzhment/">Тайм-менеджмент</a></li><li><a href="/blog/terminy-i-opredeleniya/">Термины и определения</a></li><li><a href="/blog/upravlenie-personalom/">Управление персоналом</a></li><li><a href="/blog/upravlenie-proektami/">Управление проектами</a></li><li><a href="/blog/effektivnost/">Эффективность</a></li><li><a href="/blog/yazyki-programmirovaniya/">Языки программирования</a></li><li><a href="/blog/yazykovye-osnovy/">Языковые основы</a></li><li><a href="/blog/b2b/">B2B</a></li><li><a href="/blog/hr/">HR</a></li><li><a href="/blog/it/">IT</a></li></ul></div></div></div></div></main><footer class="footer"><div class="footer-top"><div class="container"><div class="row"><div class="col-12 col-sm-4 col-md-4 col-xl-4"><a class="logo-brand" href="/"><span></span>DesignerSearch</a></div><div class="col-6 col-sm-4 col-md-4 col-xl-4"><div class="foot-item"><div class="foot-title">Контакты</div><p>E-mail: <span></span></p></div></div><div class="col-6 col-sm-4 col-md-4 col-xl-4"><div class="foot-item"><div class="foot-title">Общее</div><p></p></div></div></div></div></div><div class="footer-btm"><div class="container"><span>© 2025</span><!-- Yandex.Metrika counter --><script type="text/javascript">(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(105491784, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true, webvisor:true });</script><noscript> <div><img src="https://mc.yandex.ru/watch/105491784" style="position:absolute; left:-9999px;" alt="alt"/></div></noscript><!-- /Yandex.Metrika counter --></div></div></footer><div class="modal modal-wide fade" id="modal-1" tabindex="-1" aria-labelledby="modal-1Label" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><div class="modal-content"><div class="modal-help"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button><div class="modal-help-lft"><span>Поможем подобрать курс</span>чтобы вы получили повышение<br>или новую профессию.</div><div class="modal-help-rht"><div class="modal-form-title">Оставьте заявку, и мы перезвоним</div><form action><div class="form-group"><input class="form-control" type="text" placeholder="Имя"></div><div class="form-group"><input class="form-control" type="tel" placeholder="Телефон"></div><div class="form-group"><input class="form-control" type="email" placeholder="Email"></div><div class="form-check mb-4"><input class="form-check-input" id="agree" type="checkbox"><label class="form-check-label" for="agree">Я соглашаюсь на <a href="#">обработку персональных данных</a></label></div><button class="btn btn-primary btn-full" type="button">Оставить заявку</button></form></div></div></div></div></div><div class="modal modal-simple fade" id="modal-2" tabindex="-1" aria-labelledby="modal-2Label" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><div class="modal-content"><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button><div class="modal-title">Узнайте какая профессия вам подходит</div><p class="text-center">Пройдите тест - это займет не больше 10 минут</p><form action><div class="form-group"><input class="form-control" type="text" placeholder="Имя"></div><div class="form-group"><input class="form-control" type="email" placeholder="Email"></div><div class="form-check mb-4"><input class="form-check-input" id="agree1" type="checkbox"><label class="form-check-label" for="agree1">Я соглашаюсь на <a href="#">обработку персональных данных</a></label></div><button class="btn btn-primary btn-full" type="button">Пройти тест</button></form></div></div></div><svg width="0" height="0" style="display: none;"><symbol id="prev" viewBox="0 0 24 24" fill="none"><path d="M15 6L9 12L15 18" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></symbol><symbol id="next" viewBox="0 0 24 24" fill="none"><path d="M9 6L15 12L9 18" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></symbol></svg><script src="/js/jquery.min.js"></script><script src="/js/bootstrap.bundle.min.js"></script><script src="/js/slick.min.js"></script><script src="/js/init.js"></script></body></html>