Укажите основные группы тегов языка html

Общие сведения

Принципы гипертекстовой разметки

HTML является описательным языком разметки документов, в нем используются указатели разметки ( теги ). Теговая модель описывает документ как совокупность контейнеров, каждый из которых начинается и заканчивается тегами , то есть документ НТМL представляет собой не что иное, как обычный АSСII- файл , с добавленными в него управляющими НТМL -кодами ( тегами ). Поскольку HTML произошел от SGML , в нем разрешено использовать только три управляющих символа: горизонтальную табуляцию, перевод каретки и перевод строки . Это облегчает взаимодействие с различными операционными системами.

Теги НТМL-документов в большинстве своем просты и понятны, ибо они образованы с помощью общеупотребительных слов английского языка, понятных сокращений и обозначений. НТМL- тег состоит из имени, за которым может следовать необязательный список атрибутов тега . Текст тега заключается в угловые скобки (» «). Простейший вариант тега — имя, заключенное в угловые скобки, например, или . Для ряда тегов характерно наличие атрибутов, которые могут иметь конкретные значения, устанавливаемые автором для изменения функции тега .

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

Эта запись означает следующее: таблица шириной 570 пикселов, выравнена по центру, поле между рамкой и содержимым ячеек 10 пикселов, поле рамки 2 пикселя, ширина бордюра 16 пикселов.

Атрибуты тега следуют за именем и отделяются друг от друга одним или несколькими знаками табуляции, пробелами или символами возврата к началу строки. Порядок записи атрибутов в теге значения не имеет. Значение атрибута, если таковое имеется, следует за знаком равенства, стоящим после имени атрибута. Если значение атрибута — одно слово или число, то его можно просто указать после знака равенства, не выделяя дополнительно. Все остальные значения необходимо заключать в одинарные или двойные кавычки, особенно если они содержат несколько разделенных пробелами слов. Длина значения атрибута ограничена 1024 символами. Регистр символов в именах тегов и атрибутов не учитывается, чего нельзя сказать о значениях атрибутов. Например, особенно важно использовать нужный регистр при вводе URL ( Uniform Resource Locator , унифицированный указатель ресурса) других документов в качестве значения атрибута HREF .

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

При использовании вложенных элементов разметки в документе следует соблюдать особую аккуратность. Вложенные теги нужно закрывать, начиная с последнего. Некоторые элементы разметки не имеют конечного компонента, поскольку являются автономными элементами. Например, тег изображения , который служит для вставки в документ графического изображения, конечного компонента не требует. К автономным элементам разметки также относятся разрыв строки (
), горизонтальная линейка ( ) и теги , содержащие такую информацию о документе, которая не влияет на его отображаемое содержимое, например, теги и .

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

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

Для краткости и образности мы будем в ряде случаев вместо словосочетания » элемент разметки » применять термин » контейнер «.

Общая схема построения контейнера в формате HTML может быть записана в следующем виде:

Следует отметить, что в литературе кроме термина » контейнер » еще используется и термин «элемент». Следует быть внимательным, чтобы не путать контейнер (например, BODY ) и тег ( BODY ), используемый при формировании контейнера.

Кроме тегов , элементами HTML являются CER ( Character Entity Reference), они предназначены для представления специальных символов в документе HTML , которые могут быть неверно обработаны браузером. Предположим, создается документ HTML , речь в котором идет об элементах данного языка. Если указать имя тега просто в документе, браузер может воспринять его как непосредственно старт-тег. Для вывода таких символов и используется CER .

Например, чтобы представить символ » HTML , нужно заменить его на , а символ «>» — на > . То есть, если указать в тексте HTML строку , она будет выглядеть на экране как текст .

Может возникнуть вопрос: как быть с символами » «, «&» и со специальными символами, типа знака ударения? Можно выводить их, используя соответствующие CER , например для «&» это будет & , и т. д.

CER легко обнаружить, если посмотреть на структуру любого документа HTML , поскольку каждый из них начинается с амперсанда «&». В отличие от наименований тегов HTML , наименования CER чувствительны к регистру символов. Также наименования CER могут задаваться не в виде имени, а с помощью трехзначных кодов символов в виде &#nnn; . Далее в таблице приведены наиболее часто используемые CER и соответствующие им числовые коды.

Числовой код	Именная замена	Символ	Описание
«	«		Кавычка
&	&		Амперсанд
>		Больше
Неразрывный пробел
¡	¡	i	Перевернутый восклицательный знак
¢	¢		Цент
£	& pound ;		Фунт
¤	¤		Валюта
¥	¥		Йена
¨	¨	«	Умляут
©	©		Копирайт
«	«		Левая угловая кавычка
®	®		Зарегистрированная торговая марка
±	±		Плюс или минус
»	»		Правая угловая кавычка

Группы тегов НТМL

Все теги НТМL по их назначению и области действия можно разделить на следующие основные группы:

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

Структура гипертекстовой сети задается гипертекстовыми ссылками. Гипертекстовая ссылка — это адрес другого HTML -документа или информационного ресурса Internet , который тематически, логически или каким-либо другим способом связан с документом, в котором ссылка определена.

Естественно, при таких условиях очень важна схема адресации всех имеющихся информационных ресурсов.

Реальный механизм интерпретации идентификатора ресурса, опирающийся на URI ( Uniform Resource Identifier , универсальный идентификатор ресурса), называется URL , и пользователи WWW имеют дело именно с ним.

Типичным примером использования такой записи можно считать следующий пример:

Выглядеть это будет следующим образом:(открыть)

В приведенном выше примере тег «A», который в HTML называют якорем ( anchor ), использует атрибут HREF , обозначающий гипертекстовую ссылку ( Hypertext Reference ), для записи этой ссылки в форме URL . Данная ссылка указывает на документ с именем » index . html » в каталоге » help » на сервере » www .intuit.ru», доступ к которому осуществляется по протоколу HTTP .

Гипертекстовые ссылки в HTML делятся на два класса: контекстные гипертекстовые ссылки и общие. Контекстные ссылки вмонтированы в тело документа , как это было продемонстрировано в предыдущем примере, в то время как общие ссылки связаны со всем документом в целом и могут использоваться при просмотре любого фрагмента документа. Оба класса ссылок изначально присутствуют в стандарте языка, однако первое время наибольшей популярностью пользовались контекстные ссылки. Эта популярность привела к тому, что механизм использования общих ссылок практически полностью «атрофировался». В данном примере мы заключили URL в двойные кавычки. На самом деле, это необязательно. Кавычки (двойные или одинарные) применяются только тогда, когда внутри значения URL появляются символы-разделители ( пробел , табуляция, неотображаемые символы). Но такого сорта URL следует всячески избегать.

Структура HTML -документа позволяет задействовать вложенные друг в друга контейнеры. Собственно, сам документ — это один большой контейнер , который начинается с тега и заканчивается тегом .

В заключение отметим, что при подготовке документов HTML используется идентификатор текста DTD (Document Type Definition , определение типа документа) в качестве первой строки. Это позволяет браузеру идентифицировать документ как соответствующий стандарту HTML . Обычно (но не обязательно) каждый документ HTML начинается со строки типа:

Здесь содержится информация о том, что документ соответствует версии HTML 4.0 ; разработанной W3C ; используемый язык — английский.

HTML Базовые теги

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

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

Как уже отмечалось выше, все теги начинаются с угловой скобки . После открывающей угловой скобки следует имя тега (команды).

Например, тег предназначен для акцентирования текста, браузеры отображают такой текст курсивным начертанием. Когда браузер обнаруживает этот тег, он переключается на форматирование курсивным шрифтом текста, следующего за тегом.

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

Закрывающий тег выглядит так же, как начальный, но начинается с слэша. Итак, конечный тег для выделения курсивным шрифтом — .

Как вы успели заметить, браузер последовательно анализирует HTML – документ в поисках команд (тегов) и применяет или отключает разные параметры форматирования текста. Браузер отформатированный текст (все, что не является тегом) отображает в своем окне.

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

Заголовки

Существует специальный тег для указания заголовков в HTML. Есть 6 уровней заголовков в HTML, начиная от

HTML абзацы

С помощью HTML тэга

Вы можете определить абзац.

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

HTML ссылки

С помощью HTML тэга создаются ссылки.

Ссылки используются для связывания HTML документов друг с другом. Нажав на ссылку пользователь будет перемещен на другой HTML документ, url которого указан в атрибуте href.

Атрибут href задает адрес документа, на который следует перейти.

Атрибуты используются для предоставления дополнительной информации о HTML-элементах.

Вставка изображений

С помощью HTML тэга Вы можете вставить в HTML документ произвольное изображение.

Ширина и высота картинки может задаваться с помощью атрибутов width и height.

Понятия слова «Теги». Основные теги в HTML.

Каким браузером вы пользуетесь, Google Chrome, Internet Explorer, Mozilla Firefox, или Opera? В прочем это не важно. Все они программы для чтения и отображения веб документа, а точнее то, что вы видите на экранах своих мониторов. Открывая любое печатное издания книгу, или газету мы чётко видим своим глазом абзацы, колонки, фото, цвет текста, в общем, всё визуальное оформление таким, какое оно есть. Но браузер это робот, которому необходимо понять, как отображать, показывать нам то, что мы видим и если мы обычным языком попробуем ему сказать что фразу «Привет Мир», надо отобразить жирным курсивом, или красным цветом, то он нас не поймёт. Именно для этого и были придуман язык гипертекстовой разметки HTML, с его набором различных тегов и атрибутов к ним.

Слово «Тег» происходит от английского «tag» (дескриптор). Дескриптор, это элемент языка, в разметки гипертекста HTML. Что бы легче понять, как это работает, давайте проведём не большой эксперимент и напишем несколько раз фразу «Я учу HTML».

Рисунок 1.

На рисунке №1, мы видим четыре варианта нашей фразы. Сначала она выделена полужирным текстом, затем красным цветом, далее наклонным курсивом и наконец, наш текст стал просто кнопкой. Но как это браузер смог понять? Для этого давайте посмотрим и разберём его исходный код.

Рисунок 2.

На рисунке №2 мы видим, что в первом случае между фразой присутствует парный тег

(от английского bold, полужирный). В который, заключив нашу фразу «Я учу HTML» мы получили полужирный текст.
Далее мы видим что фраза «Я учу HTML» стала красного текста, это потому что мы использовали тег

(от английского шрифт) и указали цвет (color) код которого #F34C0C (в данном случае имеет красный оттенок).
Затем наш текст покосило вправо, то есть курсив стал наклонным, это произошло, потому что мы использовали парный тег (от английского emphasis-акцент).
И наконец, при помощи тега

(от английского button-кнопка), мы сделали его просто кнопкой.
Как вы заметили, между строками мы использовали тег

(от английского break-ломать, разрыв), это дало нам возможность написать каждую фразу с новой строки. То есть тег позволяет начать новый абзац, строку при этом не требуется парный закрывающий тег

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

Что такое теги HTML и какие виды тегов существуют

Доброго времени суток, друзья! Сегодня у нас очередная статья, посвященная одной из категорий моего сайта «HTML-путеводитель для новичков». Наверное, нужно было начинать заполнять эту категорию с написания статьи, что такое HTML или же с этого поста, в котором будет подробно изъяснено, что такое теги html. Но так уж сложилось, что в ней я уже опубликовал несколько полезных материалов, к примеру, о том, как сделать линию средствами HTML или же, как сделать рамку. Ну да ладно, надеюсь, моя оплошность не вынудила вас искать информацию среди других источников.

Для того чтобы разобраться с тегами давайте для начала вспомним что такое HTML? И так HTML – это англоязычная аббревиатура, расшифровывающаяся как — язык разметки гипертекста. Это стандартный язык, интерпретирующийся всеми современными браузерами, отвечающий за структуру и содержание страницы. Именно с помощью HTML можно указать, как будет выглядеть текст, рисунок или анимация, отображающаяся на интернет странице, а также задать ей местоположение, размер и т.п. Представленный язык разметки включает в себя теги html, являющиеся его основой.

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

Виды тегов html

Существует два типа тегов – одиночные и парные (контейнеры). Последние являются более распространенными. Все что включено между открывающимся <> и закрывающимся тегом называют содержимым контейнера. Как можно заметить внутри закрывающегося тега обязательно нужно ставить слеш, т.е. косую черту «/», находящуюся сразу же после первой угловой скобки. Действие тегов распространяется на заключенную между ними информацию.

Одиночные теги (метки) как можно догадаться состоят из одного html элемента – открывающегося тега (например ).

В независимости от вида каждый тег состоит из следующих элементов:

— Открывающаяся угловая скобка ( ).

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

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

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

Основные парные теги html

— — сообщает браузеру о том, что перед ним находится HTML документ.

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

— — определяет видимую часть документа.

— — отвечает за отображение и название документа.

— , , , , и — теги, относящиеся к созданию таблиц.

— закрытие данного тега сообщает браузерам о том, что текст отображается с новой строки, то есть с нового абзаца.

— — задает заголовок (h1…h6).

—
— тег устанавливающий перевод строки в том месте, где он находится.

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

— , - эффект для текста имитирующий стиль печатной машинки.

- - еще один HTML-тег выделяющий текст жирным. В отличии от тега воспринимается поисковыми механизмами как особо выделенный.

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

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

- - весьма распространенный тег, отвечающий за создание гиперссылки.

- - выводит в HTML документе примеры кода.

- - отвечает за отображение текста заключенного в скобки.

- - создает отступы с обеих сторон текста.

Основные одиночные теги

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

- - тег, отвечающий за отображение графических элементов (картинки). Используется вместе с обязательным атрибутом .