HTML теги.

Оцените материал
(2 голосов)

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

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

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

  •  элементы в которых как правило нет содержимого — <area>, <base>, <br>, <col>, <embed>, <hr>, <img>, <input>, <keygen>, <link>, <menuitem>, <meta>, <param>, <source>, <track>, <wbr>;
  • элементы для подключения скриптов и стилей — <script>, <style>;
  • элементы специальные которые выводят неформатированный текст — <textarea>, <title>;
  • элементы из иного пространства имен — MathML и SVG;
  • обычные элементы — все остальные элементы.

В таблице ниже я привожу  список тегов, поддерживаемых  стандартами HTML4 и HTML5. Элементы, которые были  добавлены в стандарт  HTML5, выделены  красным цветом.

html теги

 

 

Список HTML-тегов

ТегОписание
<!--...--> Служит  для комментариев.
<!DOCTYPE> Объявляет тип  документа и его версию
<a>  Гиперссылка
<abbr> Используется для задания аббревиатуры
<address> Для задания адреса выделяется курсивом в браузере
<area> Предоставляет определенную активную область на карте ссылок по которой можно клацнуть
<article> Используется для вывода содержимого то есть основного контента сайта
<aside> Используется для вывода в боковых панелях сайта
<audio> Выводит звуковое содержимое на веб-страницу
<b> Служит для задания полужирного начертания тексту
<base> Задает базовый адрес URL, относительно которого вычисляются все относительные адреса
<bdi> Изолирует отрывок текста, в котором написание идет в противоположную сторону
<bdo> Переопределяет текущее направление текста
<blockquote> Используется для вывода больших цитат
<body> Используется для тела документа то есть для всего того что мы вмдим в браузере когда открываем страничку там
<br> Переносит текст на новую строку при этом не создает абзаца
<button> Создает кнопку в качестве содержимого кнопки можно использовать текст или изображение
<canvas> Создает холст на ктором можно рисовать средствами JavaScript
<caption> Надпись к таблице добавляет
<cite> Для указания источника цитирования
<code> Для вывода програмного кода
<col> Для форматирования одного или нескольких столбцов, которые не содержат мнформацию одного типа.
<colgroup> Для создания структурной группы столбцов чтобы можно было делать над ними определенные действия
<datalist> Контейнер для выпадающего списка. Элементы списка формируется с помощью тега option
<dd> Для описания термина используется в списках определений
<del> Для удаленого текста, текст будет перечеркнут
<details> Для создания интерактивного такого виджета который можно открыть или закрыть
<dfn> Для терминов определяет слово как терми, при этом выделяя его курсивом
<div> Контейнер для группировки других тегов служит для организации и упорядочивания элементов на веб-странице
<dl> Применятся в списках определений и представляет из себя контейнер внутри которого находится описание
<dt> Для задания термина в списке определений
<em> Для к вывода текста курсивом.
<embed> Для встраивания на веб-страницу видео, аудио и другого интерактивного содержимого
<fieldset> Для группировки элементов формы. Рисует рамку вокруг них
<figcaption> Заголовок   к тегу figure.  Применятся в основном для картинок
<figure> Тег контейнер используется для помещения внутрь его картинок
<footer> Применяется для нижней части веб-документа. Эту область как правило называют подвалом
<form> Для вывода формы на веб-странице
<h1-h6> Для задания заголовоков разных уровней. H1 самый большой, а H6 самый маленький
<head> Элемент контейнер, предназначенный для объединения элементов в верхней части веб-странице как правило это верхнее меню и логотип.
<header> Секция для вводной информации сайта или группы навигационных ссылок. Может содержать один или несколько заголовков, логотип, информацию об авторе.
<hr> Выводит горизонтальную разделяющую линию
<html> Родитель всех тегов является корневым элементом всего документа.
<i> Служит для выделения текста курсивом
<iframe>

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

<img> Применяется для вывода картинок, изображений
<input> Для создания полей формы. Это текстовые поля радиобаттоны, чекбоксы
<ins> Служит для выделения текста подчеркиванием, может применяться в качестве правок в носимых в документ
<kbd> Применяется для выделения текста, вводимого с помощью клавиатуры
<keygen> Используется совместно с тегом form. Генерирует пару ключей открытый и закрытый
<label> Текстовая метка для тега input.
<legend> Заголовок элементов формы, которые объединены с помощью fieldset.
<li> Пункт маркированоого или нумерованного списков.
<link> Для задания отношений между документами, таким образом подключается стилевой файл к веб-странице.
<main> Используется  как контейнер для основонго уникального содержимого документа
<map> Создает карту ссылок и служит контейнером для тега area
<mark> Служит для выделения отдельных участков текста, выделяя их желтым фоном
<meta> Для выода метатегов находится в шапке документа
<meter> Для индикации измерения в указанном диапозоне.
<nav> Для задания навигационных панелей и меню
<noscript> Для выода части страницы, которая не поддерживает JavaScript
<object> Применяется как контейнер для встраивания объектов мультимедиа
<ol> Выводит нумерованный спмок
<optgroup> Используется как контейнер для объединения тегов option
<option> Определяет опцию и используется как пункт выпадающего списка select
<output> Для вывода результата вычисления, которое было выполнено с помощью скрипта
<p> Задает абзацы
<param> Для определения параметров для плагинов, добавленных с помощью object
<pre> Выводит текст без форматирования как есть
<progress> Для вывода индикатора выполнения какой-либо задачи
<q> Для вывода небольшой цитаты
<ruby> Применяется как контейнер для  языков Юго-Восточной Азии
<rb> Для вывода аннотации
<rt> Добавляет краткую характеристику к элементам заключенным в  тег ruby выводится уменьшенным шрифтом
<rtc> Для дополнительной аннотации
<rp> Для вывода альтернативного текста в том случае если браузер не может поддерживать тег ruby
<s> Для отображения текста перечеркнутым
<samp> Для выода текста, который является результатом выполнения скрипта
<script> Для подключения файла сценариев JavaScript к веб-странице
<section> Используется для определения логической секции страницы
<select> Служит для создания выпадающего списка в форме. Пункты выпадающего списка делаются с помощью тега option
<small> Для вывода текста маленьким шрифтом
<source> Используется для указания пути к видео и аудио файлам в тегах video, audio.
<span> Используется как контейнер для строчных элементов, аналогично тегу div для блочных
<strong> Служит для выделения текста полужирным шрифтом. Используется для создания акцента на каком-то слове или фразе
<style> Для подключения внутренней таблицы стилей
<sub> Задает нижний индекс как например в химических формулах
<summary> Для создания видимого заголовка тега details Отображается в виде закрашенного треугольника, кликнув по которому можно узнать его содержимое
<sup> Для надстрочного написания символов
<table> Используется для создания таблицы
<tbody> Тело таблицы
<td> Для задания ячейки таблицы
<textarea> Задает многострочную область для ввода текста
<tfoot> Для задания подвала таблицы
<th> Задает заголовок  ячейки таблицы
<thead> Служит для задания заголовка таблицы
<time> Используется для выода даты/времени
<title> Выводит заголовок веб-страницы можно посмотреть непосредственно на вкладке в браузере.
<tr> Выводит строку таблицы
<track> Для добавления субтитров в тегах video, audio
<u> Делает текст подчеркнутым
<ul> Для создания маркированного списка
<var> Выделяет курсивом переменные из скриптов
<video> Используется для добавления видео на веб-страницу
<wbr> Служит для указания браузеру разрыва длинной строки

В заключении посмотрите как совершаются кражи и развод в магазинах и никогда не попадайтесь.

Прочитано 810 раз Последнее изменение Воскресенье, 06 августа 2017 15:03
Другие материалы в этой категории:
Понравилась запись? Подпишитесь на обновления по почте:

Нетология

TemplateMonster

geekbrains.ru/

Поиск по сайту

Google+