описание тегов

Описание тегов для сайта. Обозначение и рекомендации.

html

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

Главные теги и мета теги мы изучили в прошлой статье «Главные Мета Теги Сайта С Описанием Функций». Там же мы узнали из каких основных тегов состоит каркас сайта. Но существует еще множество тегов, которые бывают необходимы при написании страницы сайта и сегодня я дам краткое описание тегов и их предназначение.

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


Тег — а — якорь.

Данный тег можно использовать двумя способами. Первый – создание ссылки на другой документ или сайт, используя атрибут href.

Второй – создание своеобразной закладки в текущей странице, используя атрибут name. (Например, переход к началу статьи или к концу страницы).

Пример: <a href=”https://infobusinesspartner.ru”>Сайт инфо-бизнес партнер</a>

 

Ссылка, которую еще не посетили синяя и подчеркнутая.

Ссылка, которую посетили фиолетовая и подчеркнутая.

Ссылка, которая активна в данный момент красная и подчеркнутая.

 

Подробнее об атрибутах и их предназначении можно узнать на странице «Шпаргалка HTML».


Тег <abbr>.

Используется для расшифровки аббревиатуры.


Тег <acronym>.

Используется для определения сокращений.


Тег <address>.

Используется для определения контактных данных автора, с помощью которых посетитель может связатся с ним. Например:

1<address>

2 <a href=«mailto:pupishew375@yandex.ru»>Email ru</a><br />

3</address>

Так же можно внести сюда номер телефона и адрес компании.


Тег <area>.

Показывает активные области изображения, которые являются ссылками. Элемент area всегда находится внутри тега <map>.

В HTML тег <area> не имеет закрывающий тег

В XHTML тег <area> необходимо правильно закрыть.


Тег <base>.

Определяет адрес по умолчанию или то, в каком окне должны открываться ссылки и должен находится в элементе head.

В HTML тег <base> не имеет закрывающий тег

В XHTML тег <base> необходимо правильно закрыть.


Тег <basefont>.

Указывает шрифт по умолчанию —  цвет, размер, FONT-FAMILY для всего текста в документе. Примечание: не рекомендуется использовать, лучше задавать шрифт (цвет, размер, FONT-FAMILY) по умолчанию в CSS.


Тег <bdo>.

Позволяет задать направление текста.


Тег <blockquote>.

Используется для определения длинных цитат. Браузер вставляет пространство и отступы до и после элемента blockquote.


Тег <br>.

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

В HTML тег <br> не имеет закрывающего тега.

В XHTML тег <br> должен быть правильно закрыт; вот так: <br />.

Примечание: Используйте тег <br> для переноса строк, а не для создания абзацев.


Тег <button>.

В описании тега <button>, мы можем сказать, что он вставляет в документ кнопку. Внутри элемента button Вы можете размещать контент (текст, изображения). В этом заключается разница между этим элементом и кнопками, созданными с помощью элемента input.

Всегда указывайте атрибут type для кнопки. Значение по умолчанию атрибута type в Internet Explorer — «button», в других браузерах — «submit».

Важно: Если Вы используете элемент button в HTML форме, разные браузеры обработают его по- разному. Internet Explorer передаст текст между тегами <button> и </button>, а другие браузеры — содержание атрибута «value». Используйте элемент input для создания кнопок в HTML форме.


Тег <colgroup>.

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

Примечание: Firefox, Chrome, и Safari поддерживают только width и span атрибуты элемента colgroup.


Тег <div>.

Определяет область или часть HTML документа. Часто используется для группировки блочных элементов и придания им стилей.

Атрибут «align» элемента div не поддерживается в XHTML 1.0 Strict.

Примечание: элемент div часто используется вместе с CSS для создания разметки страницы. Браузеры обычно вставляют перенос строки до и после элемента div.


Тег <dl>.

Задает список определений. Используется вместе с <dt> (создает термин) и <dd> (задает определение термина).


Теги, определяющие текст.

Тег <em>.

Курсивный текст.

Тег <strong>.

Жирный текст.

Тег <dfn>.

Определяет формулировку термина.

Тег <code>.

Для отображения компьютерного кода.

Тег <samp>.

Для отображения примера компьютерного кода.

Тег <kbd>.

Определяет текст клавиатуры.

Тег <var>.

Определяет переменную часть текста.

Тег <cite>.

Определяет цитату.


Тег <fieldset>.

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


Тег <form>.

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

Примечание: форма — элемент блочный и создает строки перед и после себя.


Тег <frame>.

Задает один определенной фрейм (окно) в наборе фреймов (frameset).


Тег <frameset>.

Задает набор фреймов. Содержит два или больше элементов frame. Каждый элемент frame содержит отдельный документ. Только определяет количество колонок или рядов в наборе фреймов.

Примечание: Если Вы хотите, чтобы страница с фреймами успешно прошла проверку на валидность, необходимо обязательно установить тип документа «Frameset DTD».

Важно: Вы не можете использовать элемент body вместе с элементом frameset. Однако, если Вы добавляете тег <noframes> с текстом специально для браузеров, которые не поддерживают фреймы, тогда этот текст необходимо размещать внутри элемента body.


Теги <h1> — <h6>.

Используются для определения заголовков. <h1> — самый крупный заголовок, <h6> — самый маленький.

Атрибут «align» элементов <h1> — <h6> не поддерживается в XHTML 1.0 Strict.


Тег <head>.

Является контейнером для всех head элементов. Элементы внутри тега <head> могут включать скрипты, инструкции для браузера для поиска таблиц стилей, предоставлять мета информацию, и многое другое.

Тег <head> определяет шапку документа, и является единственным обязательным элементом в этой секции!

Описание тегов hеad, title, body, можно посмотреть на странице «Главные Мета Теги Сайта С Описанием Функций».


Тег <html>.

Тег HTML является основным (корневым) на всей странице и информирует браузер о том, что это HTML документ.


Тег <img>.

С помощью данного тега вставляем изображение в документ html. Заметьте, что изображения технически не вставляются в страницу. На самом деле, изображения ссылаются на HTML страницы. Тег <img> создает контейнер для изображения.

У тега <img> два обязательных атрибута: src и alt.

Описание тега в различных версиях языка:

В HTML тег <img> не имеет закрывающего тега.

В XHTML тег <img> должен быть правильно закрыт.

Атрибуты «align», «border», «hspace», и «vspace» элемента img устарели и не поддерживаются в XHTML 1.0 Strict.


Тег <input>.

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

В HTML тег <input> не имеет закрывающего тега.

В XHTML тег <input> должен быть правильно закрыт.


Тег <li>.

Определяет элемент списка и используется как в упорядоченных (<ol>), так и неупорядоченных (<ul>) списках.

Атрибуты «type» и «value» элемента li устарели и не поддерживаются в XHTML 1.0 Strict.


Тег <link>.

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

В HTML тег <link> не имеет закрывающего тега.

В XHTML тег <link> должен быть правильно закрыт.

Примечание: элемент link должен быть вставлен в шапке документа, и он может повторяться любое количество раз.


Тег <map>.

используется для определения карты-изображения на стороне сервера. Карта-изображение — это изображение с кликабельными областями.

Атрибут name является обязательным.

Элемент map содержит несколько элементов area, которые определяют кликабельные области на карте-изображении.


Тег <meta>.

Предоставляет информацию про документ HTML. Мета данные не будут отображены на странице.

Мета данные могут использоваться браузерами, поисковиками, и другими веб-сервисами и всегда находится в шапке документа. Про мета теги я писал раньше в статье «Главные Мета Теги Сайта С Описанием Функций».


Тег <object>.

В описании тега скажем что он используется для вставки таких объектов как изображения, аудио, видео, Java приложения, ActiveX, PDF и Flash.

Элемент object должен был заменить элементы img и applet. Однако, из-за наличия ошибок этого не произошло.

Поддержка элемента object разными браузерами зависит от типа object. К сожалению, большинство браузеров используют разные технологии для загрузки одних и тех же типов объектов.

К счастью, у элемента object есть решение. Если объект не отображается на странице, код между тегами <object> и </object> будет выполнен. Таким образом мы можем вставить несколько объектов, чтобы угодить каждому браузеру.


Тег <ol>.

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


Тег <option>.

Элемент option находится внутри элемента select и определяет опцию (вариант) в списке select.

В HTML тег <option> не имеет закрывающего тега.

В XHTML тег <option> должен быть правильно закрыт.


Тег <p>.

Обозначает абзац и автоматически создает некоторое пространство до и после себя.


Тег <param>.

Используется для определения параметров или переменных для элементов object или applet.


Тег <script>.

Определяет клиентские скрипты, таких как JavaScript и содержит скрипты в себе или же ведет на внешний файл, используя атрибут src.


Тег <select>.

Используется для создания списков выбора (выпажающих списков).


Тег <option>.

Внутри элемента select задают доступные опции в списке.


Тег <span>.

Визуально ничего не меняет сам по себе, но предоставляет возможность добавить «крючок» части текста или документа. Когда текст помечен таким образом с помощью элемента span, Вы можете добавить стили к содержанию, или манипулировать контентом с помощью JavaScript.


Тег <style>.

Используется для определения информации о стилях HTML документа.

В элементе style Вы указываете как HTML элементы должны отображаться в браузере.

Обязательный атрибут type определяет контент элемента style. Единственное допустимое значение — «text/css».

Элемент <style> всегда находится в шапке документа.


Тег <table>.

Определяет таблицу HTML. Простая таблица содержит элемент table и одного или нескольких элементов tr, th, и td.

Элемент tr определяет ряд таблицы, элемент th — шапку таблицы, td — ячейку.

Более сложные таблицы могут также содержать такие элементы: caption, col, colgroup, thead, tfoot, и tbody.

Атрибуты «align» и «bgcolor» элемента table устарели и не поддерживаются в XHTML 1.0 Strict.


Тег <td>.

Определяет стандартную ячейку в таблице. В HTML таблице могут быть ячейки 2-х типов:

Ячейки в шапке — содержат информацию о заголовке (создаются с помощью элемента th) — Стандартные ячейки — содержат информацию (создаются с помощью элемента td)

Текст в элементе th жирный и выравненный по центру.

Текст в элементе td обычный и выравненный по левому краю.

Атрибуты «bgcolor», «height», «width», и «nowrap» элемента img устарели и не поддерживаются в XHTML 1.0 Strict.


Тег <textarea>.

Определяет многострочное текстовое поле. Текстовое поле может содержать любое количество символов, и текст отображается шрифтом с фиксированной шириной (обычно — Courier).

Размер текстового поля может быть изменен с помощью атрибутов cols и rows или CSS стилей.


Тег <tr>.

Определяет ряд в таблице и содержит один или несколько элементов th или td.


Теги <tt> <i> <b> <big> <small>.

Это теги стиля шрифта. Их можно использовать в любом документе, но более существенного эффекта можно добиться с помощью CSS.

<i> — курсивный текст <b> — жирный текст <big> — большой текст <small> — маленький текст <tt> — телетайп текст.


Тег <ul>.

Используется для создания неупорядоченного списка.


Подробнее описание тегов и их атрибутов, как я уже писал выше, вы можете найти на сайте Ruseller.com.

Статья написана с использованием материалов сайта ruseller.com. Выражаю благодарность автору сайта ruseller.com — Евгению Попову за предоставленный материал.

Если статья была вам полезна – поделитесь с друзьями в соцсетях.

С уважением, Александр.

1 thought on “Описание тегов для сайта. Обозначение и рекомендации.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.