← Назад ко всем вопросам

Какие знаешь теги в HTML

1️⃣ Как кратко ответить

HTML теги — это элементы, которые используются для создания структуры веб-страницы. Основные теги включают: <html>, <head>, <title>, <body>, <h1>-<h6>, <p>, <a>, <img>, <ul>, <ol>, <li>, <div>, <span>, <table>, <tr>, <td>, <th>, <form>, <input>, <button>, <link>, <meta>, <script>, <style>.

2️⃣ Подробное объяснение темы

HTML (HyperText Markup Language) — это язык разметки, используемый для создания и структурирования веб-страниц. HTML состоит из элементов, которые обозначаются тегами. Теги определяют, как браузер должен отображать содержимое страницы. Каждый тег имеет свое назначение и используется для различных целей.

Основные теги HTML

  1. <html>: Корневой элемент HTML-документа. Все остальные элементы должны находиться внутри этого тега.

  2. <head>: Содержит метаинформацию о документе, такую как заголовок, ссылки на стили и скрипты.

  3. <title>: Определяет заголовок документа, который отображается в заголовке окна браузера или на вкладке.

  4. <body>: Содержит основное содержимое HTML-документа, которое отображается на веб-странице.

  5. <h1>-<h6>: Заголовки, которые используются для обозначения заголовков разного уровня. <h1> — самый важный заголовок, <h6> — наименее важный.

  6. <p>: Определяет абзац текста.

  7. <a>: Создает гиперссылку. Атрибут href указывает URL, на который ведет ссылка.

  8. <img>: Вставляет изображение. Атрибуты src и alt указывают путь к изображению и альтернативный текст соответственно.

  9. <ul> и <ol>: Создают неупорядоченные (списки с маркерами) и упорядоченные (нумерованные списки) списки соответственно.

  10. <li>: Элемент списка, используется внутри <ul> или <ol>.

  11. <div>: Блочный элемент, используемый для группировки других элементов и применения стилей.

  12. <span>: Строчный элемент, используемый для стилизации части текста или других элементов.

  13. <table>, <tr>, <td>, <th>: Используются для создания таблиц. <table> — контейнер для таблицы, <tr> — строка таблицы, <td> — ячейка, <th> — заголовочная ячейка.

  14. <form>: Создает форму для ввода данных пользователем.

  15. <input>: Поле ввода данных в форме. Атрибут type определяет тип ввода (например, текст, пароль, кнопка).

  16. <button>: Создает кнопку, которую можно нажать для выполнения действия.

  17. <link>: Используется для подключения внешних ресурсов, таких как таблицы стилей.

  18. <meta>: Определяет метаинформацию о документе, такую как кодировка, автор и описание.

  19. <script>: Включает или ссылается на скрипты, такие как JavaScript.

  20. <style>: Включает CSS-стили, которые применяются к элементам HTML.

Пример использования тегов

<!DOCTYPE html>
<html>
<head>
    <title>Пример HTML-документа</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <h1>Заголовок страницы</h1>
    <p>Это пример абзаца текста. <a href="https://example.com">Ссылка на сайт</a>.</p>
    <img src="image.jpg" alt="Описание изображения">
    <ul>
        <li>Элемент списка 1</li>
        <li>Элемент списка 2</li>
    </ul>
    <form action="/submit" method="post">
        <input type="text" name="username" placeholder="Введите имя">
        <button type="submit">Отправить</button>
    </form>
</body>
</html>
  • <!DOCTYPE html>: Объявление типа документа, указывающее, что используется HTML5.
  • <html>: Начало HTML-документа.
  • <head>: Содержит метаинформацию, такую как <title>, <meta>, и <link>.
  • <body>: Основное содержимое страницы, включая заголовки, абзацы, изображения, списки и формы.
  • <h1>: Заголовок первого уровня.
  • <p>: Абзац текста с вложенной ссылкой <a>.
  • <img>: Изображение с атрибутами src и alt.
  • <ul> и <li>: Неупорядоченный список с элементами.
  • <form>, <input>, <button>: Форма с полем ввода и кнопкой отправки.

Тема: Web-тестирование, DevTools и хранилища
Стадия: Tech

🔒 Подпишись на бусти автора и стань Алигатором, чтобы получить полный доступ к функционалу сайта и отслеживать свой прогресс!

Твои заметки