HTML — это язык Интернета. Веб-страницы, которые вы просматриваете на своем компьютере или телефоне, включая эту, написаны на языке разметки гипертекста с использованием так называемых «тегов HTML». Вы можете думать о HTML как о «скрытом коде», который управляет структурой веб-страницы.
В конечном счете, когда вы изучаете любой новый язык, вы начинаете с простых фраз и строите оттуда. Изучение HTML ничем не отличается. Вы начнете с освоения общих тегов HTML. Это эквивалентно изучению «простых фраз» на разговорном языке. Эти фразы становятся основой, на которой вы строите свои знания и речь, точно так же, как HTML-теги являются основой, на которой вы будете развивать свои навыки веб-разработки.
Формат HTML-тега
Вы можете распознать тег HTML, потому что он окружен символами <и> в начале и конце тега. Между этими двумя символами будет другой текст, который определяет, какой тип HTML-тега пишется. Например, если вы знаете, что «hr» означает горизонтальное правило (или строку), вы должны написать это для тега HTML:
<Ч>
Вы только что написали HTML-тег, который рисует горизонтальное правило на веб-странице.
Большинство тегов HTML идут парами. Они размещаются в начале и в конце раздела текста, чтобы определять содержание, которое они будут содержать. Эти пары тегов составляют элемент HTML . Когда вы узнаете, что <strong> и </ strong> являются открывающими и закрывающими тегами, чтобы сделать текст жирным, вы начинаете понимать, как теги HTML влияют на внешний вид текста на веб-странице.
Это предложение будет выделено жирным шрифтом из-за скрытых тегов HTML.
Закрывающий строгий тег (который обозначает «сильный акцент» и который по умолчанию отображает текст жирным шрифтом) идентичен открывающему сильному тегу, за исключением того, что он включает косую черту в теге. Этот формат используется большинством HTML-тегов. Открывающий и закрывающий теги одинаковы, с добавлением косой черты в конце, после первого символа «<».
Комбинации HTML-тегов
HTML-теги часто используются в сочетании. Открывающим и закрывающим тегами для выделенного (курсивом) текста являются <em> и </ em> . Добавление тегов курсива к одному слову в примере с полужирным предложением приводит к тому, что слово отображается на веб-странице как жирным шрифтом, так и курсивом.
Это предложение будет выделено жирным шрифтом из-за скрытых тегов HTML.
Всякий раз, когда несколько тегов используются вместе в элементе веб-страницы, а некоторые теги появляются внутри других, они называются вложенными тегами HTML. Вы должны помнить, что вложенные теги , которые являются тегами внутри других, должны быть закрыты, прежде чем их содержащие теги могут быть закрыты. Посмотрите на этот пример:
<p> Это текст, который <em> выделен </ em> по определенной причине. </ p>
Вы должны заметить, что тег <em> открыт внутри <p>, что означает, что он должен быть закрыт до появления закрывающего тега </ p>. Думайте о вложенных тегах как о коробках внутри других коробок. Внутренние ящики должны быть закрыты до их наружного применения, содержащие ящики.
HTML-теги и веб-страницы
В действительном HTML есть десятки HTML-тегов. Некоторые теги HTML определяют очень распространенные базовые элементы, такие как абзацы, тогда как другие являются более сложными и добавляют больше функциональности, например теги ссылки или «привязки». Список тегов HTML дает снимок многих функций, которые теги могут выполнять на веб-странице с помощью тегов.
Есть также некоторые теги, которые требуются для всех веб-страниц. При создании первой страницы вы будете использовать тег <html>, с которого начинается веб-страница; <title>, который сообщает браузеру, что отображать в верхней части панели браузера, и <body>, куда отправляется вся информация о веб-странице и является самой большой частью вашей страницы.
Список тегов HTML не очень поможет, пока вы не пройдете учебник по HTML, но после этого вы можете использовать теги HTML для создания своей собственной веб-страницы. Одно замечание, не перегружайтесь количеством возможных тэгов HTML. Хотя существуют сотни возможных тегов для использования, реальность такова, что вы, вероятно, будете использовать только несколько из них снова и снова. На самом деле, есть некоторые HTML-теги, которые мы никогда не использовали ни разу за десятилетия веб-дизайна!
Устаревшие теги
HTML5 — это текущий стандарт разметки. Некоторые из тегов, которые использовались в более ранних версиях HTML, теперь обрабатываются таблицами стилей в HTML5. Устаревшие теги HTML были удалены из спецификаций HTML. Лучше не использовать устаревшие теги.