Довідник по HTML тегам

  • Головна
  • html
  • теґи

HTML — це мова розмітки за допомогою тегів. Тобто, HTML документ буде складатися з деякої групи елементів, де кожен елемент буде визначатися (починатися та закінчуватися) певним тегом (Для деяких елементів кінцевий тег не є обов’язвовим)

Тобто, тег — це назва елементу, записана у кутових дужках ()

Кожен HTML тег має свою унікальну назву з визначеним синтаксисом, яка записується латинськими літерами і не чутлива до регістру.

= Тільки в HTML5.         = Не підтримується в HTML5.

ТеґОпис
<!—…—> Визначає коментар в документі.
<a> Створює посилання.
<abbr> Визначає абревіатуру чи акронім.
<address> Визначає контактну інформацію автора/власника документа або статті
<applet> Визначае вбудований аплет.
<area> Тег, який визначає інтерактивну область в зображенні-карті (елемент <map>), тобто при кліці на певну область зображення відбуваються
<article> Тег `<article>` визначає незалежний, самодостатній зміст від іншої частини сайту.
<aside> Блок з додатковою інформацією.
<audio> Додає аудіозапис на веб-сторінку.
<b> Робить текст жирним.
<base> Змінює абсолютний шлях сторінки.
<basefont> Задає шрифт за замовчуванням
<bdo> Змінює напрямок тексту.
<big> Робить текст більшим.
<blockquote> Довга цитата.
<body> Визначає кордоти тіла веб-сторінки
<br> Створює перехід на новий рядок.
<button> Визначає кнопку.
<canvas> Використовується як контейнер для графіки
<caption> Визначає назву таблиці.
<center> Вирівнює текст по центру.
<cite> Визначає назву твору
<code> Вказує, що зміст теґа — програмний код.
<col> Задає загальні властивості для однієї чи декількох колонок.
<colgroup> Створює структурну групу, що об’єднує один або кілька стовпчиків.
<datalist> Створює список варіантів.
<dd> Визначення терміну.
<del> Визначає текст котрий був видалений в новій версії документа
<details> Визначає контент котрий користувач може приховати чи відобразити
<dfn> Позначає термін в тексті.
<dialog> Створює діалогове вікно
<dir> Список з назв директорій.
<div> Блок.
<dl> Список термінів/визначень
<!DOCTYPE> Задає версію HTML.
<dt> Задає назву терміна
<em> Акцентує увагу на тексті.
<embed> Вставляє в html-документ зовнішній об’єкт.
<fieldset> Групує пов`язані поля форми.
<figcaption> Підпис до малюнка
<figure> Групування елементів.
<font> Задає колір, розмір і тип шрифту.
<footer> Визначає футер (підвал) веб-сторінки
<form> Визначає форму.
<frame> Визначає фрейм на веб-сторінці
<frameset> Визначає структуру фреймів
<h2> Заголовок першого рівня.
<h3> Заголовок другого рівня.
<h4> Заголовок третього рівня.
<h5> Заголовок четвертого рівня.
<h5> Заголовок п’ятого рівня.
<h6>
Заголовок 6 рівня.
<head> Визначає інформацію про документ
<header> Позначає розділ HTML-сторінки як заголовок.
<hgroup> Призначається для групування заголовків на веб-сторінці
<hr> Горизонтальна лінія.
<html> Вказує, що почався HTML-документ.
<i> Виділяє текст курсивою.
<iframe> Вставляє на сторінку фрейм
<img> Відображає графічне зображення на веб-сторінці
<input> Поле вводу даних.
<ins> Визначає текст, котрий був доданий в новому документі
<kbd> Позначає клавіші, що можуть бути натиснені.
<keygen> Поле для генерації пари ключів.
<label>
Визначає мітку для елементу форми
<legend> Заголовок до елементів, що згруповані за допомогою тега `fieldset`.
<li> Визначає елемент списку
<link> Тег `link` служить для зв’язку html-документа із зовнішнім файлом.
<main> Визначає основний зміст документа.
<map> Визначає карту-зображення для картинки
<mark> Виділяє текст жовтим
<menu> Відображає список пунктів меню.
<menuitem> Додає нові пункти в контекстне меню
<meta> Визначає метадані документа
<meter> Створює візуальну шкалу.
<nav> Набір навігаційних посилань.
<noscript> Визначає альтернативний контент для користувачів у котрих не працює JavaScript
<object>		 Визначає вбудований об’єкт.
<ol> Визначає впорядкований список.
<optgroup> Групує список опцій.
<option> Створює пункт списку
<output> Визначає результат розрахунку
<p> Визначає текстовий абзац.
<param> Задає параметри для об’єктів
<picture> Являє собою контейнер для зберігання кількох елементів <source> , які підтримують елемент <img>
<pre> Виводить попередньо відформатований текст
<progress> Відображає хід виконання завдання.
<q> Коротка цитата.
<rp> Що показати в браузеру, котрий не має підтримки рубінових анотацій.
<rt> Додає анотацію зверху чи знизу від тексту
<ruby> Додає пояснення до тексту.
<s> Визначає текст застарілим та закреслює його
<samp> Визначає текст як вивід програми ябо скрипта
<script> Додає на веб-сторінку JavaScript скрипт
<section> Задає розділ документу
<select> Створює елемент введення у вигляді списку.
<small> Відображає текст зі зменшеним розміром шрифту
<source> Визначає альтернативне джерело медіа-файлу для відтворення
<span> Визначає унікальний ідентифікатор частини тексту
<strike> Відображає текст закресленим
<strong> Визначає важливий текст
<style> Визначає стиль елементів веб-сторінки.
<sub> Відображає текст у вигляді нижнього індексу.
<summary> Визначає заголовок для теґу `<details>`
<sup> Відображає шрифт у вигляді верхнього індексу.
<table> Задає таблицю на HTML-сторінці
<tbody> Визначає тіло таблиці.
<td> Визначає комірку таблиці.
<textarea> Область введення багаторядкового тексту.
<tfoot> Задає нижній колонтитул таблиці.
<th> Визначає клітинку-заголовок таблиці
<thead> Визначає групу заголовків HTML-таблиці
<time> Визначає час або дату.
<title> Визначає заголовок веб-сторінки
<tr> Визначає рядок в таблиці.
<track> Визначає текстову доріжку до медіа-елементів
<tt> Відображає текст моношининним шрифтом
<u> Визначає підкреслений текст
<ul> Визначає позначений(ненумерований) список
<var> Використовується для виділення змінних з комп’ютерних програм.
<video> Відображає відео на сайті.
<wbr> Вказує браузеру місце, де допускається робити перенос рядка в тексті

5. Что такое теги и для чего они нужны? — Знакомство с HTML — codebra

Что такое парные теги?

Продолжим наше ознакомление с искусством верстки на HTML. На очереди – парные теги. И вообще, что за слово такое ругательное? Теги? Итак, тег, умные люди, в частности отцы паутины, называют «дескриптор», но я его так никогда не называл, и не буду называть на моем сайте, можно же просто – «тег». Тег – это элемент языка разметки текста (HTML). Кратко говоря: «Тег – элемент HTML», все, что внутри тега, называют содержанием элемента. Логично, не так ли? Я говорю проще: «внутри тега», умные слова только на конференциях нужно использовать, а не в быту. Итак, подобрались к парным тегам, включаем логику, парный, хм… значит, есть начальный тег и конечный тег, но их так не называют, кроме Википедии, конечно. Правильно так: «Открывающий и Закрывающий тег». Даже с большой буквы написал, в знак уважения. Теперь, например: <p>…</p>, есть открывающий, есть закрывающий тег, значит парный тег. Тег <h2>…</h2> тоже парный, кстати, знакомлю, это заголовок первого уровня, то есть простой текст, по отношению к нему, будет меньше. Для большего понимания проведем аналогию: тег – это одежда, а его содержимое – это человек. Облачив человека в одежду, он преобразуется. Также, если обернуть содержимое (текст, например) в тег, он поменяет свой внешний вид. С парными тегами кончено.

Что такое одинарные теги?

Несложно догадаться, что у одинарного тега нет закрывающего, пример: <br>, <hr>, <img>. Думаю, кто-то видел теги такого плана: <br/>, ну и так далее. Это «Старый стиль». Да, когда был HTML4, нужно было закрывать одинарный тег именно так, но с появлением HTML5 многое изменилось, и не только это конечно. Не настаиваю на написание закрывающей косой черты и в системе проверки это учтено, но давайте быть новаторами и не тормозить процесс! Те три тега «перенос строки», «разделительная линия», «изображение» соответственно.

И в продолжении

Старайтесь учить сразу эти теги. Отрабатывайте их в заданиях и придумывайте свои задания, для себя. Читайте литературу и тематические сайты. А теперь приступите к заданию. В нем немного нужно подумать. Даю подсказку, после слова «это» напишите какой-то тег, тот который в задании.

О парных тегах

Умение быстро и четко манипулировать тегами, это хороший старт в изучении. Вы практически всегда будете работать с этими тегами верстая сайт. В уроке пятом (парные теги), вы познакомитесь ближе с парными тегами.

Правильно структурировать информацию, тоже хорошее дело, ведь поисковые системы (Yandex, Google), любят, когда заголовки помещены в теги заголовка первого уровня – это информация официальная, ее озвучил глава Google. На поисковую выдачу влияет так же использование тегов «маркированный список» и «нумерованный список». На поисковую выдачу так же влияет использование атрибутов title, alt. Да это только малая часть, на самом деле, есть 200 официальных пунктов от Google, которые влияют на выдачу в поисковике. Возможно, обо всех их я напишу.

Похожие уроки и записи блога

Первое знакомство с PythonЗнакомство с Python

Модули в PythonЗнакомство с Python

Теги в HTML. Одинарные и парные тегиЗнакомство с HTML

Работа с файлами в Python Знакомство с Python

Написание модулей в PythonЗнакомство с Python

Обработка исключений (try/except) в PythonЗнакомство с Python

Что такое HTML?Знакомство с HTML

Типы данных в PythonЗнакомство с Python

Погружение в PythonЗнакомство с Python

Предыдущий урок «4. Теги в HTML. Одинарные и парные теги» Следующий урок «6. Одинарные теги»

Объект

— Глоссарий веб-документов MDN: Определения терминов, связанных с Интернетом ). Сущности часто используются для отображения зарезервированных символов (которые в противном случае интерпретировались бы как HTML-код) и невидимых символов (например, неразрывных пробелов).

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

Примечание: У многих персонажей есть запоминающиеся сущности. Например, объект для символа авторского права ( © ) равен © . Для менее запоминающихся символов, таких как — или — , вы можете использовать справочную таблицу или инструмент декодера.

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

Чтобы отобразить эти символы в виде текста, замените их соответствующими объектами символов, как показано в следующей таблице.

Символ Объект Примечание
и & Интерпретируется как начало ссылки на сущность или символ.
< < Интерпретируется как начало тега
> > Интерпретируется как окончание тега
" " Интерпретируется как начало и конец значения атрибута.
  Интерпретируется как неразрывный пробел.
– – Интерпретируется как короткое тире (половина ширины единицы em).
— – Интерпретируется как длинное тире (равное ширине символа «m»).
© &копия; Интерпретируется как знак авторского права.
® ® Интерпретируется как зарегистрированный знак.
™ &торговля; Интерпретируется как товарный знак.
≈ ≈ Интерпретируется как почти равно знаку.
≠ ≠ Интерпретируется как не равно знаку.
£ фунтов стерлингов; Интерпретируется как символ фунта.
€ &евро; Интерпретируется как символ евро.
° &град; Интерпретируется как символ градуса.
  • Официальный список персонажей

Обнаружили проблему с содержанием этой страницы?

  • Редактировать страницу на GitHub.
  • Сообщить о проблеме с содержимым.
  • Просмотрите исходный код на GitHub.
Хотите принять участие?

Узнайте, как внести свой вклад.

Эта страница была последний раз изменена участниками MDN.

Специальные символы в HTML

90 229 9
левая одинарная кавычка   ‘ ‘
правая одинарная кавычка   ’ ’
одинарная 9-кавычка   ‚ ‚
двойная кавычка слева   “ "
правая двойная кавычка   ” ”
двойная младшая девятка   „ „
кинжал   &кинжал; †
двойной кинжал   &Кинжал; ‡
знак на мельницу   ‰ ‰
одинарная цитата с левым углом   ‹ ‹
одиночный угол, направленный вправо   › ›
черный пиковый костюм   ♠ ♠
черный клубный костюм   &трефы; ♣
костюм черного сердца   ♥ ♥
черный бриллиантовый костюм   ♦ ♦
зачеркивание, = надчеркивание интервала   ‾ ‾
стрелка влево ← ← ←
стрелка вверх ↑ ↑ ↑
стрелка вправо → → →
стрелка вниз ↓ ↓ ↓
стрелка северо-запад ↖ ↖ ↖
стрелка северо-восток ↗ ↗ ↗
юго-западная стрелка ↙ ↙ ↙
юго-восточная стрелка ↘ ↘ ↘
черный треугольник вершиной вверх ▲ ▲ ▲
черный маленький треугольник, направленный вершиной вверх ▴ ▴ ▴
черный треугольник, указывающий вправо ▶ ▶ ▶
черный маленький треугольник, указывающий вправо ▸ ▸ ▸
черный указатель вправо ► ► ►
черный треугольник с вершиной вниз ▼ ▼ ▼
черный маленький треугольник, направленный вершиной вниз ▾ ▾ ▾
черный треугольник, указывающий влево ◀ ◀ ◀
черный маленький треугольник, направленный влево ◂ ◂ ◂
черный указатель влево ◄ ◄ ◄
Знак товарного знака ™ &торговля; ™
не используется �-
		    
горизонтальная вкладка    
перевод строки    
не используется
пробел    
восклицательный знак !   !
двойные кавычки " " "
Знак номера #   #
знак доллара $   $
знак процента %   %
амперсанд & & и
апостроф '   '
левая скобка (   (
правая скобка )   )
звездочка *   *
плюс +   +
запятая ,   ,
дефис -   -
период .   .
косая черта / ⁄ /
цифры 0-9 0-
9		    
двоеточие :   :
точка с запятой ;   ;
Знак меньше < < <
знак равенства =   =
знак больше > > >
знак вопроса ?   ?
у знака @   @
прописные буквы A-Z A-
Z		    
левая квадратная скобка [   [
обратная косая черта \   \
правая квадратная скобка ]   ]
горизонтальная черта (подчеркивание) _   _
серьезное ударение `   `
строчные буквы a-z a-
z		    
левая фигурная скобка {   {
вертикальная планка |   |
правая фигурная скобка }   }
тильда ~   ~
многоточие … … …
в тире – –
длинное тире — –
не используется ˜-
Ÿ		    
неразрывный пробел      
перевернутый восклицательный знак ¡ !искл. ¡
знак цента ¢ % ¢
фунт стерлингов £ фунт; £
общий знак валюты ¤ &текущий; ¤
знак иены ¥ ¥ ¥
сломанная вертикальная планка ¦ ¦ или &brkbar; ¦
Знак раздела § § §
умлаут ¨ ¨ или умереть; ¨
авторское право © &копия; ©
женский порядковый номер ª ª ª
левый угол « « «
без знака ¬ &нет; ¬
мягкий дефис ­ ­
зарегистрированный товарный знак ® ® ®
макрон акцент ¯ ¯ или &хибар; ¯
знак градуса ° &град; °
плюс-минус ± +плюс; ±
верхний индекс два ² ² ²
верхний индекс три ³ &up3; ³
острый акцент ´ ´ ´
микрознак µ &микро; µ
знак абзаца )
средняя точка · · ·
седилья ¸ ¸ ¸
Верхний индекс один ¹ ¹ ¹
порядковый мужской род º º º
цитата под прямым углом » » »
четверть ¼ ¼ ¼
половинка ½ ½ ½
три четверти ¾ ¾ ¾
перевернутый знак вопроса ¿ ¿ ¿
прописная буква А, гравировка À À À
прописная буква А, ударение Á &Острый; Á
прописная буква A, ударение по циркумфлексу Â &Цирк. Â
прописная буква A, тильда Ã &Атильда; Ã
заглавная А, умлаут Ä Ä Ä
верхний регистр A, кольцо Å &Кольцо; Å
верхний регистр AE Æ Æ Æ
прописная C, седилья Ç Ç Ç
прописная буква E, гравировка È &Выгравировать; È
заглавная буква E, ударение É É É
прописная буква E, ударение по циркумфлексу Ê Ê Ê
прописная E, умлаут Ë Ë Ë
заглавная I, гравировка Ì &Изображение; Ì
прописная I, акут Í Í Í
прописная буква I, ударение по циркумфлексу Î Î Î
заглавная I, умлаут Ï Ï Ï
заглавная буква Eth, исландский Ð Ð Ð
N прописная, тильда Ñ &Nтильда; Ñ
заглавная O, гравировка Ò Ò Ò
прописная буква O, ударение Ó &Острый; Ó
прописная буква O, ударение по циркумфлексу Ô Ô Ô
заглавная O, тильда Õ &Отильда; Õ
заглавная O, умлаут Ö Ö Ö
знак умножения × &раз; ×
заглавная O, косая черта Ø &Ослэш; Ø
заглавная буква U, гравировка Ù &Угр. ; Ù
заглавная буква U, акут Ú Ú Ú
заглавная буква U, ударение по циркумфлексу Û Û Û
заглавная U, умляут Ü Ü Ü
заглавная буква Y, акут Ý Ý Ý
верхний регистр THORN, исландский Þ &ШИП; Þ
строчные диезы, немецкий ß ß ß
строчная буква а, серьезное ударение à &грав; à
нижний регистр a, ударение á á á
строчная буква a, ударение по циркумфлексу â &acir; â
строчная а, тильда ã &далее; ã
строчная а, умлаут ä ä ä
нижний регистр a, кольцо å å å
нижний регистр ae æ æ æ
строчная c, седилья ç ç ç
строчная буква e, серьезное ударение è &грав; é é é
строчная буква e, ударение по циркумфлексу ê ê ê
строчная е, умляут ë ë ë
строчные буквы i, серьезное ударение ì ` ì
нижний регистр i, акут í í í
нижний регистр i, диакритический знак î î î
строчная i, умляут ï ï ï
eth в нижнем регистре, исландский ð &et; ð
n в нижнем регистре, тильда ñ – –
строчная буква o, серьезное ударение ò ò ò
строчная буква o, ударение ó ó ó
нижний регистр o, циркумфлексное ударение ô ô ô
строчная о, тильда õ õ х
строчная о, умляут ö ö ö
знак деления ÷ &разделить; ÷
нижний регистр o, косая черта ø ø ø
строчная буква u, серьезное ударение ù ù ù
строчная буква u, акут ú ú ú
строчная буква u, ударение по циркумфлексу û û û
строчная буква u, умляут ü ü ü
нижний регистр y, ударение ý ý ý
шип в нижнем регистре, исландский þ &шип; þ
строчная у, умляут ÿ ÿ ÿ
Альфа &Альфа; Α
альфа альфа; α
Бета &Бета; Β
бета бета; β
Гамма &Гамма; Γ
гамма γ γ
Дельта &Дельта; Δ
дельта дельта; δ
Эпсилон &Эпсилон; Ε
эпсилон &эпсилон; е
Зета &Зета; Ζ
дзета дзета; ζ
Эта &Эта; Η
эта &эта; η
Тета &Тета; Θ
тета &тета; θ
Йота &Йота; Ι
йота йота; ι
Каппа &Каппа; Κ
каппа &каппа; κ
Лямбда &Лямбда; Λ
лямбда лямбда; λ
Му &Мю; Μ
мю мю; μ
Nu Ν Ν
ну &ну; ν
Xi Ξ Ξ
xi ξ ξ
Омикрон &Омикрон; Ο
омикрон &омикрон; ο
Пи &Пи; Π
пи π №
Ро &Ро; Ρ
ро &ро; ρ
Sigma Σ Σ
сигма &сигма; σ
Тау &Тау; Τ
тау &тау; τ
Ипсилон &Ипсилон; Υ
ипсилон &ипсилон; υ
Фи &Фи; Φ
фи &фи; φ
Чи &Чи; х
чи &чи; χ
фунт/кв.

No related posts.

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

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