Читать учебники:
HTML, CSS, JavaScript, DOM
PHP, MySQL, Apache, WordPress
Photoshop, Веб-дизайн, Flat
SEO, SMM, Landing Page

HTML-теги

Раскрываем тему о HTML-тегах и их категориях

HTML-теги
Категории и виды HTML-тегов
Описание видов HTML-тегов по категориям.

Теги HTML — являются основной частью языка HTML.

Схема HTML-тега, выглядит следующим образом:

Схема парного тега:

<имяТега> </имяТега>

Схема одиночного тега:

<имяТега>

Иногда в HTML тегах устанавливают атрибуты со значениями:

<имяТега атрибут="значение"> </имяТега>
<имяТега атрибут="значение">

Где имяТега — это h1, p, b, img, a, table и др.

Виды (категории) HTML-тегов

Теги делятся на несколько видов. Я их разделил на десять категорий, в других учебниках количество категорий может различаться:

  1. Парные теги,
  2. Одиночные теги,
  3. Блочные теги,
  4. Строчные теги,
  5. Новые теги HTML5,
  6. Устаревшие теги,
  7. Нестандартные теги,
  8. Теги верхнего уровня (html, head и body),
  9. Теги головы HTML-документа,
  10. Семантические теги.

Один и тот же тег, может одновременно принадлежать нескольким категориям, например тег <small> </small> относится к следующим видам: парный, строчный, семантический.

Рассмотрим каждый вид по отдельности.

Парные теги

Парные теги имеют открывающий и закрывающий тег, перед именем закрывающего тега ставят знак слэш (косая черта) /

Вот небольшой список парных тегов:
<h1> </h1> — заголовок,
<p> </p> — абзац,
<b> </b> — жирный шрифт.

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

Одиночные теги не имеют закрывающего тега.

Вот небольшой список одиночных тегов:
<img> — изображение,
<br> — перенос строки,
<input> — элемент формы.

Блочные теги

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

Вот небольшой список блочных тегов:
<h1> </h1> — заголовок первого уровня,
<p> </p> — абзац,
<table> </table> — таблица.

Строчные теги

Строчные теги — это теги в начале и в конце которых НЕ ставится перенос строки.

Вот небольшой список строчных тегов:
<b> </b> — жирный шрифт,
<i> </i> — наклонный шрифт,
<input> — элемент формы.

Новые теги HTML5

Новые теги HTML5 — это теги, которые появились в спецификации языка HTML5.

Вот небольшой список новых тегов:
<article> </article> — основной контент страницы,
<canvas> </canvas> — замена флеш-технологии,
<video> — видео-файл.

Устаревшие теги

Устаревшие теги — это теги использовать которые с точки зрения спецификации языка HTML5, не рекомендуется. Однако при создании сайтов, вы можете использовать устаревшие теги, браузеры всё равно их поймут.

Вот небольшой список устаревших тегов:
<big> </big> — увеличивает размер шрифта на единицу,
<font> </font> — форматирует текст,
<isindex> — поисковая строка.

Нестандартные теги

Нестандартные теги — это теги, которые не поддерживаются ни одной спецификацией HTML, но некоторые браузеры их понимают.

Вот небольшой список нестандартных тегов:
<bgsound> — проигрывает музыку при открытии страницы,
<blink> </blink> — мигающий текст,
<marquee> <marquee> — бегущая строка.

Теги верхнего уровня

Теги верхнего уровня — это теги отвечающие за создание HTML-документа, их всего три:

<html> </html> — начало и конец HTML-документа,

<head> </head> — голова HTML-документа,

<body> </body> — тело HTML-документа.

Теги головы HTML-документа

В голове HTML-документа, между тегами <head> </head>, обычно находятся теги отвечающие за описание страницы, за подключение внешних файлов и др., они не видны пользователю. Единственный тег головы, который видит пользователь, это тег title.

Вот небольшой список тегов головы HTML-документа:
<link> — подключает внешние файлы .css, .xml, .ico,
<meta> </meta> — мета-теги,
<title> </title> — название страницы,
<style> </style> — внедряет CSS-код в страницу,
<script> </script> — загружает внешний JavaScript-файл .js, также между этими тегами может размещаться JavaScript-код.

Семантические теги

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

Вот небольшой список семантических тегов:
<article> </article> — обрамляют основной контент страницы,
<blockquote> </blockquote> — обрамляют цитаты взятыя из внешних источников,
<small> </smal> — обрамляет текст написанный мелким шрифтом в юридических документах.

Также следует отметить, что нынешняя политика HTML стремится сделать почти все теги, семантическими.

По каким категориям еще можно разделять HTML-теги?

К десяти категориям выше, можно также добавить еще несколько, это:
— Текстовые теги,
— Теги форматирования,
— и т.д. список будет пополняться.

Также, теги можно разделить по специализации:
— Теги таблиц,
— Теги форм,
— Теги списков,
— Теги фреймов,
— Мета-теги,
— и т.д.

Читать далее: Парные теги

Вам понравились уроки? Поддержите проект "Учебники для вебмастера"!
Можете отправить с карточки, мобильного телефона или яндекс.кошелька.
Минимальная сумма перевода 30 руб.

Категория: Статья
Статья создана: 15 Окт 2014
Статья обновлена: 5 Фев 2016

Один комментарий на «“HTML-теги”»

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

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

gabdrahimov.ru - сайт для веб-разработчиков
(c) При использовании материалов, ссылка на сайт обязательна
Автор: Габдрахимов Дамир Google
e-mail: gabdr0[at]ya.ru
разработка сайта - gabdr0
бесплатный PHP хостинг (без рекламы!) - Beget