HTML-теги

Узнайте, что такое тег в HTML, как он работает и зачем нужен. Разберём основные виды тегов и их применение на примерах.

Бесплатная консультация юриста

+7 (800) 301-07-30

Реклама jurik.ru

Тег — это элемент разметки, заключённый в угловые скобки. Большинство тегов работают парами: открывающий (``) и закрывающий (``). Между ними размещается контент, который этот тег форматирует или описывает.

Это текст внутри тега параграфа

—

Структурные теги документа

—

Теги для работы с текстом

Заголовки (h1–h6)

Иерархия заголовков помогает структурировать документ. На странице должен быть только один тег `

` — это главный .

Раздел статьи

Подраздел

Мелкий пункт

Вспомогательный
Минимальный

Важно: Не пропускайте уровни (не переходите от `h2` сразу к `h4`). Это нарушает логику документа и ухудшает доступность для программ чтения с экрана.

Абзац и перенос строки

Тег `

` создаёт абзац — основной строительный блок веб-текста:

Это первый абзац текста. Он отделяется от других элементов вертикальными отступами.

Это второй абзац.

Тег `
` выполняет принудительный перенос строки внутри текста. Это одиночный тег (не имеет закрывающей пары):

Адрес офиса:
Москва, ул. Примерная, 15
Метро «Таганская»

Физическое и логическое форматирование

Тег « делает текст жирным (визуально выделяет):

Обратите внимание на важное условие договора.

Для семантического выделения важности лучше использовать «, но « остаётся актуальным для визуального акцентирования без дополнительного смысла.

Другие полезные текстовые теги:
— « — курсив (например, термины или названия)
— « — подчёркнутый текст
— `` — зачёркнутый текст (устаревшая информация)
— `` — выделение маркером (жёлтый фон по умолчанию)

—

Списки: упорядоченные и неупорядоченные

Списки, один из самых частых способов структурировать информацию.

Неупорядоченный список (`
    `)

Используется, когда порядок пунктов не важен. Маркеры по умолчанию — точки:

  • CSS
  • JavaScript

Упорядоченный список (`
    `)

Применяется, когда важна последовательность (шаги инструкции, рейтинги):

  1. Подготовьте ингредиенты
  2. Нагрейте сковороду
  3. Добавьте масло

Атрибуты `

    `:
    — `start=»5″` — начать нумерацию с 5
    — `type=»A»`, заглавные буквы (A, B, C)
    — `reversed` — обратный порядок номеров

    Вложенные списки

    Тег `

  1. ` может содержать другие списки:
    • Фрукты
      • Яблоки
      • Бананы
    • Овощи

    —

    — `

    ` — независимый фрагмент контента (статья, пост)
    — « — тематическая секция документа
    — `