Как называются команды в html

1.2. HTML-элементы

HTML-элементы — основа языка HTML. Каждый HTML-документ состоит из дерева HTML-элементов и текста. Каждый HTML-элемент обозначается начальным (открывающим) и конечным (закрывающим) тегом. Открывающий и закрывающий теги содержат имя элемента.

Все HTML-элементы делятся на пять типов:

пустые элементы — , ,
, , ,

, , , , , , , , , ;
элементы с неформатированным текстом — , ;
элементы, выводящие неформатированный текст — , ;
элементы из другого пространства имён — MathML и SVG;
обычные элементы — все остальные элементы.

В таблице приведен полный список элементов, поддерживаемых HTML4 и HTML5. Экспериментальные и устаревшие элементы исключены. Элементы, добавленные в спецификацию HTML5, выделены бирюзовым цветом.

Полный список HTML-элементов

Таблица 1. HTML-элементы

Элемент Описание

Используется для добавления комментариев.

Объявляет тип документа и предоставляет основную информацию для браузера — его язык и версия.

Создаёт гипертекстовые ссылки.

Определяет текст как аббревиатуру или акроним. Поясняющий текст задаётся с помощью атрибута title .

Задает контактные данные автора/владельца документа или статьи. Отображается в браузере курсивом.

Представляет собой гиперссылку с текстом, соответствующей определенной области на карте-изображении или активную область внутри карты-изображения. Всегда вложен внутрь элемента .

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

Представляет контент страницы, который имеет косвенное отношение к основному контенту страницы/сайта.

Загружает звуковой контент на веб-страницу.

Задает полужирное начертание отрывка текста, не придавая акцент или важность выделенному.

Задает базовый адрес (URL), относительно которого вычисляются все относительные адреса. Это поможет избежать проблем при переносе страницы в другое место, так как все ссылки будут работать, как и прежде.

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

Отображает текст в направлении, указанном в атрибуте dir , переопределяя текущее направление написания текста.

Выделяет текст как цитату, применяется для описания больших цитат.

Представляет тело документа (содержимое, не относящееся к метаданным документа).

Перенос текста на новую строку.

Создает интерактивную кнопку. Элемент может содержать текст или изображение.

Холст-контейнер для динамического отображения изображений, таких как простые изображения, диаграммы, графики и т.п. Для рисования используется скриптовый язык JavaScript.

Добавляет подпись к таблице. Вставляется сразу после открывающего тега

	Используется для указания источника цитирования. Отображается курсивом.
	Представляет фрагмент программного кода, отображается шрифтом семейства monospace .
	Выбирает для форматирования один или несколько столбцов таблицы, не содержащих информацию одного типа.
	Создает структурную группу столбцов, выделяющую множество логически однородных ячеек.
	Элемент используется для связывания значения атрибута value , которое представлено в машиночитаемом формате и может быть обработано компьютером, с содержимым элемента.
	Элемент-контейнер для выпадающего списка элемента . Варианты значений помещаются в элементы .
	Используется для описания термина из элемента .
	Помечает текст как удаленный, перечёркивая его.
	Создаёт интерактивный виджет, который пользователь может открыть или закрыть. Представляет собой контейнер для контента, видимый заголовок виджета помещается в элемент .
	Определяет слово как термин, выделяя его курсивом. Текст, идущий следом, должен содержать расшифровку этого термина.
	Интерактивный элемент, с которым взаимодействует пользователь для выполнения задачи, например, диалоговое окно, инспектор или окно. Без атрибута open не виден для пользователя.
	Элемент-контейнер для разделов HTML-документа. Используется для группировки блочных элементов с целью форматирования стилями.
	Элемент-контейнер, внутри которого находятся термин и его описание.
	Используется для задания термина.
	Выделяет важные фрагменты текста, отображая их курсивом.
	Элемент-контейнер для встраивания внешнего интерактивного контента или плагина.
	Группирует связанные элементы в форме, рисуя рамку вокруг них.
	Заголовок/подпись для элемента .
	Самодостаточный элемент-контейнер для такого контента как иллюстрации, диаграммы, фотографии, примеры кода, обычно с подписью.
	Определяет завершающую область (нижний колонтитул) документа или раздела.
	Форма для сбора и отправки на сервер информации от пользователей. Не работает без атрибута action .
	Создают заголовки шести уровней для связанных с ними разделов.
	Элемент-контейнер для метаданных HTML-документа, таких как , , , , .
	Секция для вводной информации сайта или группы навигационных ссылок. Может содержать один или несколько заголовков, логотип, информацию об авторе.
	Горизонтальная линия для тематического разделения параграфов.
	Корневой элемент HTML-документа. Сообщает браузеру, что это HTML-документ. Является контейнером для всех остальных html-элементов.
	Выделяет отрывок текста курсивом, не придавая ему дополнительный акцент.
	Создает встроенный фрейм, загружая в текущий HTML-документ другой документ.
	Встраивает изображения в HTML-документ с помощью атрибута src , значением которого является адрес встраиваемого изображения.
	Создает многофункциональные поля формы, в которые пользователь может вводить данные.
	Выделяет текст подчеркиванием. Применяется для выделения изменений, вносимых в документ.
	Выделяет текст, который должен быть введён пользователем с клавиатуры, шрифтом семейства monospace.

Таблица-шпаргалка с элементами

Для удобства пользования я сгруппировала HTML-элементы по тематическим разделам, добавив значения свойства display . Чтобы перейти к таблице, кликните по рисунку.

Основы работы в сети Интернет

Для создания веб-страниц используется гипертекстовый язык описания документов – HTML (Hyper Text Markup Language).

Это язык программирования, имеющий свой набор команд.

Каждый веб-документ представляет собой программу, написанную на этом языке (HTML-код).

Создавать веб-страницы можно как в HTML -редакторах ( FrontPage ), так и в текстовых редакторах разного уровня ( Word , Блокнот).

Тегами (от англ. tag — ярлык, метка) называются команды HTML. Чтобы отличить теги от текста документа их заключают в угловые скобки. Например, тег br > означает команду «начало новой строки». Теги могут быть как одиночными, так и парными. Парные теги указывают начало и окончание действия команды. Тег, который указывает на окончание, помечается символом слеш (/).

Структура веб-страницы задается следующими парными тегами:

Пара <html> и html> указывает формат страницы и отмечает его границы.

Пара <head> и head> указывает на начало и конец заголовка. Включают описание документа, ключевые слова (keywords) для поиска, название документа и другую информацию, идентифицирующую страницу.

Пара > и указывает имя страницы.

Пара и указывает на начало и конец «тела» страницы. Тело – это последовательность команд, обеспечивающая вывод в окно браузера форматированного текста, ссылок и других элементов веб-страницы.

Рисунки и другие объекты веб-страницы хранятся отдельно от HTML-кода

HTML-код содержит команды, которые сообщают браузеру, где хранится объект и в какой области окна он должен быть отображен.

Таким образом, веб-страница, как правило, хранится в виде файла формата .html и папки с объектами.

Конспект «Структура HTML-документа»

Каждый HTML-документ начинается с декларации типа документа или «доктайпа». Тип документа необходим, чтобы браузер мог определить версию HTML и правильно отобразить страницу.

Простейшая HTML-страница состоит как минимум из трёх тегов: , и . Тег обычно содержит заголовок, ключевые слова, описание страницы и другие служебные данные. Также внутри него подключаются внешние ресурсы, например, стили. Содержимое этого тега не отображается на странице напрямую. А в теге хранится содержание страницы, которое отображается в окне браузера.

Для подключения стилей к странице существует тег . Для этого у него есть атрибут href в котором задаётся адрес стилевого файла, а значение stylesheet атрибута rel говорит браузеру, что мы подключаем именно стили, а не что-то другое.

Ещё один элемент, который располагается в — это тег . В нём задаётся заголовок страницы, который отображается во вкладках браузера. По заголовку должно быть понятно, о чём эта страница, даже когда она не открыта в браузере, а отображается в результатах поиска или в браузерных закладках.

 Тренажёры — HTML Academy

Ещё один важный тег, располагающийся внутри это тег . Он одиночный, то есть не требует парный закрывающий тег в конце. С помощью можно сообщать браузеру, поисковому роботу или другому устройству различную служебную информацию (или метаинформацию) о вашем сайте: кодировку текста, описание контента и так далее. Для этого используются теги с разными атрибутами и их значениями.

Кодировка текста HTML-страницы указывается с помощью атрибута charset :

Самая распространённая современная кодировка — utf-8 .

Перечень ключевых слов задаётся тегом , у которого атрибут name имеет значение keywords . Ключевые слова (самые важные слова из содержания страницы) перечисляются в атрибуте content через запятую:

Краткое описание (или аннотация) страницы задаётся похожим образом, только значение атрибута name меняется на description :

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

Тег содержит вводную часть страницы, которую чаще называют «шапкой», а тег описывает заключительную часть страницы, или «подвал». Существует тег , который обозначает крупный смысловой (или «логический») раздел.

Тег , обозначает цельный, законченный и самостоятельный фрагмент информации.

Для создания логического раздела с основной навигацией предназначен тег (сокращение от английского «navigation»). Обычно в включают ссылки на другие страницы или навигацию по текущей странице.

Тег включает в себя дополнительное содержание, не связанное напрямую с основным. Такие блоки ещё часто называют «сайдбарами» или боковыми панелями.

Для создания основной структуры текста используют заголовки. В HTML существует целое семейство заголовочных тегов: от до . Тег обозначает самый важный заголовок (заголовок верхнего уровня), а тег обозначает подзаголовок самого нижнего уровня.

Спецификация HTML
 Раздел 1 Введение
 Раздел 1.1 Происхождение языка

Основную структуру текста создают с помощью заголовков, а более мелкую выстраивают с помощью параграфов (или абзацев). Для разметки параграфов предназначен тег

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

Хотите начать карьеру веб-разработчика? Записывайтесь на профессию «Фронтенд-разработчик», которая стартует 12 декабря 2023. Всего от 4 130 ₽ в месяц.

Наша группа в VK
Наш канал на YouTube
Наша страница в Twitter
Наш канал в Telegram

Что такое HTML язык и с чем его едят..

HTML язык по своей сути не является языком программирования.. он является языком разметки гипертекстовых документов. Иными словами он отвечает за расположение в документе Ваших текстов, рисунков, таблиц.. предназначенных для жизни в сети Интернет. Заставить его посчитать, сколько будет дважды два невозможно, в нем нет логических функций, зато красиво и главное легко выложить информацию о том, что дважды два будет четыре — это запросто. Читается этот язык при помощи знакомых Вам программ, именуемых браузерами (обозревателями), которые «знают» стандартные команды html языка, и «пережевывая» их выводят на монитор компьютера документы в том виде, в котором хочет представить их веб мастер — составитель документа.

Теперь о командах — их называют дескрипторами, но чаще — тегами.

Вернемся к нашей первой страничке.. итак мы написали:

Моя первая страничка

Привет мир.

Меня зовут Карлсон, это моя первая страничка!

Так вот то что написано между — называют тегами они не видны читателю, заглянувшему на Вашу страницу, зато хорошо видны браузеру, который наткнувшись на тег понимает его как сигнал к тому, что далее будет документ, который необходимо прочитать и вывести на монитор в нужном виде.. а вот тег говорит о том что документ закончился и от него, то бишь браузера, больше ничего не требуется и он может отдыхать с чистой совестью.

Так что же мы написали? и как это читает браузер?

— начало документа.. опять работы привалило..
— смотрим словарик английского переводим «голова» …в голове моей опилки не беда!! . здесь указывается основная служебная информация о документе.. ну и что они там от меня хотят?
— «название» значит.. это в шапке окна нужно написать его название:
Моя первая страничка — опять чайник тренируется..
— все название закончилось.. можно идти дальше..
— ага и в голове кроме названия больше никаких вздорных мыслей не держим..
— «тело» документа всё что написано ниже выставляем на всеобщее обозрение
Привет мир. — как мило! Достали уже.
— переносим текст на следующую строчку.. я даже догадываюсь что в ней будет.
Меня зовут (здесь Ваше имя), это моя первая страничка! — ну да так и есть.. ничего пооригинальнее придумать не могут..
— что всё что ли? Больше ничего не отображать?
— ну вот и конец!! Не будить, не кантовать, при пожаре выносить первым!!

Вот так примерно и происходит чтение нашей странички.. Как видите браузер довольно своенравный тип, поэтому команды ему нужно подавать чёткие и ясные, иначе он разругается.. причем в слух.. а по сему запомним следующие вещи:

1) Необходимо раз и навсегда запомнить что если есть открывающий тег то обязательно должен быть и закрывающий

Хотя есть и исключения как например у нас тег — он закрытия не требует потому что говорит лишь о том, что следует писать с новой строки. Кстати попробуйте добавить еще пару тройку таких же перед строчкой «Меня зовут..» и Вы увидите, что в результате она заметно опустилась вниз.. (Ну естественно в блокноте сохраните изменения, а в браузере нажмите кнопку «обновить»)

2) Все документы должны иметь вот такой шаблон кода:

— начало документа
— начало головы
— закрытие головы
— начало тела
— закрытие тела
— конец документа

Данные теги являются обязательными! Писать их необходимо всегда для каждой новой странички, и только в таком порядке! Не пытайтесь перевернуть всё с ног на голову..

Открывающий и закрывающий тег по типу представляет собой своего рода ёмкость, ящик в который могут складываться другие теги — ящички поменьше.. следовательно, согласно логики документ должен выглядеть так:

Если писать, например, так:

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

Ну вот мы научились писать простой текст, начало положено! в следующей главе я расскажу о том, что с ним можно сделать..

Полезные советы:

При написании сайта создайте папку в любом удобном месте на Вашем жёстком диске, называйте как угодно, лишь бы понятно было.. в эту папку сохраняете Ваши странички, присваивая им осмысленные имена.. варианты типа ааа.html, 123.html приведут к беспорядку и путанице… На данном этапе этот совет не покажется дельным, но в дальнейшем это значительно облегчит Ваш труд. Представьте к примеру хотя бы 20-30 таких файлов названия которых нужно держать в голове, чтобы связать их перекрёстными ссылками. Порядок, прежде всего!

При написании кода советую придерживаться «хорошей манере письма», то есть писать теги «лесенкой» по мере вложенности одного тега в другой. Со временем Вы поймёте что читать код написанный вот так:

Моя первая страничка

Привет мир.

Меня зовут Карлсон, это моя первая страничка!

Значительно легче, чем так:

Моя первая страничка

Привет мир.

Меня зовут Карлсон, это моя первая страничка!

И уж тем более чем вот так:

Моя первая страничкаПривет мир.
Меня зовут Карлсон, это моя первая страничка!

Хоть это и дело привычки.. всё же лучше привыкнуть писать «разборчиво».

Читать:

Что такое проводник

Предыдущая запись

Как называются двери у легендарного mercedes benz 300sl

Следующая запись

1.2. HTML-элементы

Полный список HTML-элементов

Таблица-шпаргалка с элементами

Основы работы в сети Интернет

Конспект «Структура HTML-документа»

Спецификация HTML

Раздел 1 Введение

Раздел 1.1 Происхождение языка

Что такое HTML язык и с чем его едят..

Полезные советы:

Похожие записи