Основные примеры HTML
В этой главе мы покажем несколько основных примеров HTML.
Не волнуйтесь, если мы используем теги, о которых вы еще не знаете.
HTML-документы
Все HTML-документы должны начинаться с объявления типа документа: <!DOCTYPE html>.
Сам HTML-документ начинается <html>и заканчивается на </html>.
Видимая часть документа HTML находится между <body>и </body>.
Пример
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Декларация <!DOCTYPE>
Объявление <!DOCTYPE>представляет тип документа и помогает браузерам правильно отображать веб-страницы.
Он должен появиться только один раз в верхней части страницы (перед любыми HTML-тегами).
Объявление <!DOCTYPE>не чувствительно к регистру.
Объявление <!DOCTYPE>для HTML5:
<!DOCTYPE html>
HTML-заголовки
Заголовки HTML определяются с помощью тегов <h1>to .<h6>
<h1>определяет самый важный заголовок. <h6>определяет наименее важный заголовок:
Пример
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
HTML-абзацы
Абзацы HTML определяются с помощью <p>тега:
Пример
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML-ссылки
HTML-ссылки определяются с помощью <a>тега:
Пример
<a href="https://www.w3schools.com">This is a link</a>
Назначение ссылки указано в hrefатрибуте.
Атрибуты используются для предоставления дополнительной информации об элементах HTML.
Вы узнаете больше об атрибутах в следующей главе.
HTML-изображения
HTML-изображения определяются с помощью <img>тега.
Исходный файл ( src), альтернативный текст ( alt),
widthи heightпредоставляются в качестве атрибутов:
Пример
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
Как просмотреть исходный код HTML?
Вы когда-нибудь видели веб-страницу и задавались вопросом: «Эй! Как они это сделали?»
Просмотр исходного кода HTML:
Щелкните правой кнопкой мыши HTML-страницу и выберите «Просмотреть исходный код страницы» (в Chrome) или «Просмотреть исходный код» (в Edge) или аналогичный вариант в других браузерах. Откроется окно, содержащее исходный HTML-код страницы.
Проверьте элемент HTML:
Щелкните правой кнопкой мыши элемент (или пустую область) и выберите «Проверить» или «Проверить элемент», чтобы увидеть, из чего состоят элементы (вы увидите как HTML, так и CSS). Вы также можете редактировать HTML или CSS «на лету» на открывшейся панели «Элементы» или «Стили».