Какую структуру имеет веб-страница?

  1. <!DOCTYPE html>:

    • Объявление типа документа. Указывает браузеру, как интерпретировать HTML.

  2. <html>:

    • Корневой элемент HTML. Обрамляет всю структуру веб-страницы.

  3. <head>:

    • Содержит мета-информацию о документе, такую как заголовок (<title>), ссылки на стили (<link>), метатеги (<meta>), и скрипты (<script>).

  4. <title>:

    • Определяет заголовок документа, который отображается в верхней части браузера или на вкладке.

  5. <body>:

    • Содержит основное содержимое документа, такое как текст, изображения, ссылки и другие элементы.

  6. Структура контента внутри <body>:

    • Заголовки (<h1>, <h2>, ..., <h6>): Используются для определения заголовков разного уровня.

    • Параграфы (<p>): Используются для группировки текста в абзацы.

    • Списки (<ul>, <ol>, <li>): Используются для создания неупорядоченных и упорядоченных списков.

    • Изображения (<img>): Используются для вставки изображений.

    • Ссылки (<a>): Используются для создания гиперссылок.

    • Формы (<form>, <input>, <button>): Используются для создания интерактивных форм.

Пример простой HTML-страницы:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Моя веб-страница</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header>
        <h1>Добро пожаловать на мою веб-страницу!</h1>
    </header>
    <nav>
        <ul>
            <li><a href="#section1">Раздел 1</a></li>
            <li><a href="#section2">Раздел 2</a></li>
            <li><a href="#section3">Раздел 3</a></li>
        </ul>
    </nav>
    <main>
        <section id="section1">
            <h2>Раздел 1</h2>
            <p>Текст раздела 1.</p>
        </section>
        <section id="section2">
            <h2>Раздел 2</h2>
            <p>Текст раздела 2.</p>
        </section>
        <section id="section3">
            <h2>Раздел 3</h2>
            <p>Текст раздела 3.</p>
        </section>
    </main>
    <footer>
        <p>&copy; 2023 Моя веб-страница</p>
    </footer>
</body>
</html>

Last updated

Was this helpful?