--- status: seed type: concept tags: [html, web-development, structure, tables, forms] created: 2026-05-30 updated: 2026-05-30 title: Основы HTML (структура, таблицы, формы) source: ["[[10-html_основы_НП.pdf]]", "[[13-html-таблицы.pdf]]", "[[15-html-формы-1.pdf]]"] --- # Основы HTML **HTML (Hypertext Markup Language)** — язык разметки для структурирования и отображения веб-страниц. ## Структура HTML-документа Базовый шаблон (HTML5): ```html Заголовок страницы ``` - `` — объявление типа документа. - `` — метаданные (не отображаются в браузере). - `` — основное содержимое. ### Метатег Viewport Критичен для мобильных устройств. Позволяет контролировать масштаб. ```html ``` ## Основные теги и семантика HTML5 вводит семантические теги для улучшения понимания структуры поисковиками и программами экранного доступа: - `

`, `

`. ### Текст и форматирование - **Заголовки:** `

`...`

`. - Абзацы и переносы: `
`, `
`. - Логическое выделение: `` (важное, жирный), `` (акцент, курсив), `` (код). - Контейнеры: `
` (блочный), `` (строчный). ### Списки - Маркированный: `` + ``. - Нумерованный: `` + ``. ### Ссылки и изображения - Ссылка: `Текст`. - Изображение: ``. --- ## Таблицы Используются для отображения структурированных данных. Не рекомендуются для верстки макета. Структура таблицы: ```html Заголовок таблицы Заголовок столбца 1 Заголовок столбца 2 Данные 1 Данные 2 Итог 1 Итог 2 ``` - Объединение ячеек: `colspan` (по горизонтали), `rowspan` (по вертикали). --- ## Формы Инструмент для сбора данных пользователя. Базовая форма: ```html Имя: ``` ### Элементы управления: - ``: `type="text"`, `password`, `email`, `number`, `checkbox`, `radio`, `file`, `date`, `hidden`. - ``: многострочный ввод текста. - `<fieldset>` + `<legend>`: группировка связанных полей. ### Атрибуты валидации: - `required`, `minlength`, `maxlength`, `min`, `max`, `pattern` (регулярные выражения).