Примеры тегов: Что такое теги на сайте, примеры тегов

Содержание

HTML теги — справочник с примерами и описанием команд

В этом справочнике мы рассмотрим все основные html теги, которые пригодятся при создании сайтов и веб-документов.

Вы узнаете, что это такое и для чего нужно.

Также на примерах я покажу как это все используется.

Содержание:

  • Что это такое
  • Виды
  • Основные элементы
  • Справочник:
    • Основной контейнер
    • Служебные
    • Коды для текста
    • Таблицы
    • Изображения
    • Списки
    • Гиперссылки
    • Встроенный контент
    • Для группировки
    • Формы

Что такое html теги

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

Одни теги говорят браузеру, что нужно отобразить абзац. Другие, что нужно отобразить заголовок. Третьи, что нужно сделать таблицу.

С помощью таких команд мы общаемся с браузером и как бы программируем его действия.

Парный html тег с атрибутом

Все теги имеют одинаковый формат. Они начинаются с угловой скобки < и заканчиваются на обратную скобку >.

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

Но конечно же, здесь нельзя писать все подряд и выдавать это за теги. Есть определенный набор тегов по спецификации html.

Например, выделение текста жирным:

<b>Жирный текст</b>

Ниже мы еще к этому вернемся.

Стоит сказать, что теги пишутся маленькими латинскими буквами. Хотя нет ничего страшного если вы их напишите большими.

Однако стандарт подразумевает писать их в нижнем регистре.

У тега могут быть атрибуты.

Это дополнительные детали, которые его описывают. Они всегда вставляются в открывающей части.

К примеру, в тег <а> (ссылка на документ) указываем путь к странице, к которой нужно перейти после клика. Записывается она в атрибут href.

<a href="https://site.ru">Текст ссылки</a>

Виды хтмл тегов

Все хтмл теги подразделяются на два вида:

  1. Одиночные
  2. Парные

Парные имеют открывающий и закрывающий тег.

Также между этими двумя элементами обязательно должен присутствовать какой-то контент или другие теги. Причем уровень вложенности не ограничен.

К примеру, если вам нужно вставить абзац, то сначала ставим открывающий тег <p>. Это будет начало абзаца.

Далее вставляем нужный текст (контент). После этого мы должны сообщить браузеру, где наш абзац заканчивается. Для этого вставляем закрывающий тег </p>.

<p>Пример небольшого текстового абзаца</p>

Обратите внимание!

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

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

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

Далее вставляем открывающий тег в том месте, где начнется выделение. А закрывающий там, где оно заканчивается.

<p><b>Пример</b> небольшого текстового абзаца</p>
Наглядный пример выделения

Есть определенные правила вложенности тегов. Более подробно на эту тему вы найдете в статье про структуру html документа.

Одиночные состоят из одного тега. Например, <hr>. Представляют собой самостоятельные сущности, которым не нужен внутренний контент.

<br> <!-- перенос строки -->
<hr> <!-- разделитель -->
<input type="text"> <!-- поле ввода -->
<img src="logo.png"> <!-- вывод изображения -->

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

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

Вот они:

  • doctype
  • html
  • head
  • body

Doctype предназначен для определения типа документа. То есть по нему браузер понимает, что это html-документ, а не что-либо еще.

Тег HTML — это контейнер, который имеет основное содержимое страницы. Контейнером называется потому что у него есть парный тег (открывающий и закрывающий).

Абсолютно все элементы (кроме doctype) должны быть вложены в этот контейнер.

Head содержит в себе служебные теги. Они предназначены для работы поисковых систем и браузеров.

Обычно эта информация не видна пользователю.

Body — это основное тело страницы. Она содержит рабочие элементы, которые видны пользователям. Как правило, это информационный контент.

Вот так выглядит скелет любой html-страницы:

<!doctype html>
<html>
    <head>
        
    </head>
    <body>
        
    </body>
</html>

Справочник HTML

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

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

Тег HTML

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

ИмяОписаниеЗначение свойства display
<html></html>корневой элемент html-документаblock

Служебные

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

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

ИмяОписаниеЗначение свойства display
<!—…—>комментарийnone
<!DOCTYPE>объявление типа документаnone
<head></head>контейнер для метаданных html-документаnone
<title></title>заголовок / имя html-документаnone
<meta>мета-данные веб-страницыnone
<link>подключает внешние таблицы стилейnone
<script></script>подключает сценарии к страницеnone
<style></style>подключает встраиваемые таблицы стилейnone
<base>базовый url-адрес, относительно которого вычисляются относительные адресаnone
<noscript></noscript>секция, не поддерживающая скриптblock

HTML теги для текста

Здесь расположены основные html теги для работы с текстом на странице. Как правило, это различные выделения, подчеркивания, вставка заголовков и так далее.

Такие элементы делают текст наиболее приятным для восприятия. Обязательно используйте такие команды для форматирования текста.

ИмяОписаниеЗначение свойства display
<h2></h2> — <h6></h6>заголовки шести уровнейblock
<p></p>параграфы в текстеblock
<br>перенос текста на новую строкуnone
<hr>горизонтальная линияblock
<wbr>возможное место разрыва длинной строкиnone
<blockquote></blockquote>большая цитатаblock
<cite></cite>источник цитированияinline
<q></q>краткая цитатаinline
<code></code>фрагмент программного кодаinline
<kbd></kbd>текст, вводимый пользователем с клавиатурыinline
<pre></pre>выводит текст с пробелами и переносамиblock
<samp></samp>результат выполнения сценарияblock
<var></var>выделяет переменные из программblock
<del></del>перечёркивает текст, помечая как удаленныйblock
<s></s>перечёркивает неактуальный текстblock
<dfn></dfn>выделяет термин курсивомblock
<em></em>выделяет важные фрагменты текста курсивомblock
<i></i>выделяет текст курсивом без акцентаblock
<strong></strong>выделяет полужирным важный текстblock
<b></b>задает полужирное начертание отрывка текста, без дополнительного акцентаblock
<ins></ins>подчёркивает изменения в текстеblock
<u></u>выделяет отрывок текста подчёркиванием, без дополнительного акцентаblock
<mark></mark>выделяет фрагменты текста желтым фономblock
<small></small>отображает текст шрифтом меньшего размераblock
<sub></sub>подстрочное написание символовblock
<sup></sup>надстрочное написание символовblock
<time></time>дата / время документа или статьиblock
<abbr></abbr>аббревиатура или акронимnone
<address></address>контактные данные автора документа или статьиblock
<bdi></bdi>изолирует текст, читаемый справа налевоinline
<bdo></bdo>задаёт направление написания текстаinline
<ruby></ruby>контейнер для Восточно-Азиатских символов и их расшифровкиinline
<rp></rp>тег для скобок вокруг символовnone
<rt></rt>расшифровка символовblock

Теги таблицы HTML

Здесь расположены html теги для создания таблиц. Такие элементы тоже рекомендую использовать на странице.

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

ИмяОписаниеЗначение свойства display
<table></table>html-таблицаtable
<tr></tr>строка таблицыtable-row
<th></th>заголовок столбца таблицыtable-cell
<td></td>ячейка таблицыtable-cell
<thead></thead>блок заголовков таблицыtable-header-group
<tbody></tbody>тело таблицыtable-row-group
<tfoot></tfoot>нижний колонтитул таблицыtable-footer-group
<caption></caption>подпись к таблицеtable-caption
<col>выбирает для форматирования столбцыtable-column
<colgroup></colgroup>контейнер для одного или нескольких <col>table-column-group

Картинки

Обязательно используйте тег картинки в html-документе. Тоже полезно при восприятии и усвоения информации.

Еще полезно и в SEO.

Можно получать трафик с поиска по картинкам. И стоит отметить, что материал без изображений очень плохо ранжируется в поиске.

ИмяОписаниеЗначение свойства display
<img>html-изображенияinline
<map></map>активные области на карте-изображенииinline
<area>гиперссылка с текстом или активная область внутри карты-изображенияinline
<canvas></canvas>холст-контейнер для динамического отображения изображенийinline-block

Списки

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

Информацию в списке старайтесь давать максимально коротко и понятно. То есть не делать длинных предложений.

НазваниеОписаниеЗначение свойства display
<ol></ol>упорядоченный нумерованный списокblock
<ul></ul>маркированный списокblock
<li></li>элемент спискаlist-item
<dl></dl>контейнер для термина и его описанияblock
<dt></dt>задаёт терминblock
<dd></dd>расшифровывает терминblock

Ссылки

Тег ссылки в html всегда один. Будьте осторожны при его использовании.

Всегда проверяйте, куда вы ссылаетесь. То есть, что это за сайт и релевантен ли он данной теме.

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

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

Также обращайте на количество линков. Ссылайтесь только тогда, когда это необходимо!

Встраиваемый контент

Контент, который можно встроить в основное тело страницы. Также полезно для восприятия информации.

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

ИмяОписаниеЗначение свойства display
<audio></audio>добавляет аудио-файлыinline-block
<video></video>добавляет видео-файлыinline-block
<source>указывает местоположение и тип альтернативных файлов для <audio> и <video>none
<track>субтитры для элементов <audio> и <video>none
<embed>встраивает внешний интерактивный контент или плагинinline-block
<object></object>контейнер для встраивания мультимедиаinline-block
<param>задаёт параметры для плагинов, встраиваемых с помощью элемента <object>none
<iframe></iframe>создаёт встроенный фреймblock

Группировка контента

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

Структура страницы

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

Это улучшает как удобство пользования, так и скорость загрузки страницы.

ИмяОписаниеЗначение свойства display
<body></body>тело html-документаblock
<div></div>контейнер для разделов html-документа, группирует блочные элементыblock
<span></span>контейнер для строчных элементовinline
<header></header>секция для вводной информации сайта или группы навигационных ссылокblock
<footer></footer>секция для нижнего колонтитула документа или разделаblock
<section></section>логическая область (раздел) страницы, обычно с заголовкомblock
<article></article>раздел контента, образующий независимую часть документа или сайтаblock
<aside></aside>контент страницы, имеющий косвенное отношение к основному контентуblock
<nav></nav>раздел документа, содержащий навигационные ссылки по сайтуblock
<figure></figure>независимый контейнер для такого контента как изображения, диаграммы и т. п.block
<figcaption></figcaption>заголовок для элемента <figure>block
<details></details>контейнер с дополнительными сведениями, который можно открыть или закрытьblock
<summary></summary>видимый заголовок для элемента <details>block
<main></main>контейнер для уникального основного содержимого в пределах одной страницы сайтаblock

Формы

Они тоже частенько используются на сайтах. Самая главная и обязательная из них, это форма поиска.

Если это многостраничник, то такой элемент должен обязательно присутствовать.

Также сюда можно отнести формы подписки, обратной связи, регистрации и так далее.

НазваниеОписаниеЗначение свойства display
<form></form>html-формаblock
<input>многофункциональные поля формыinline-block
<textarea>многострочное поле формыinline-block
<label></label>текстовая метка для элемента <input>inline
<datalist></datalist>контейнер для выпадающего списка элемента <input> с <option>-значениямиnone
<select></select>элемент управления с выбором значений из предложенных вариантов <option>inline-block
<optgroup></optgroup>контейнер с заголовком для группы элементов <option>block
<option></option>вариант (опция) в раскрывающемся спискеblock
<fieldset></fieldset>группирует связанные элементы в формеblock
<legend></legend>заголовок элементов формы, сгруппированных с помощью <fieldset>block
<button></button>интерактивная кнопкаinline-block
<keygen>генерирует закрытый и открытый ключиinline-block
<progress></progress>индикатор выполнения задачиinline-block
<meter></meter>индикатор измерения в заданном диапазонеinline-block
<output></output>поле для вывода результата вычисленияinline

На этом все!

Мы рассмотрели html теги и их значение. Используйте данную справку, как шпаргалку при создании сайтов.

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

Теги и атрибуты | Марафон HTML+CSS

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

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

<имя_тега>...</имя_тега>

Открывающий тег указывает на то, где начинается элемент, закрывающий — где заканчивается. Закрывающий тег образуется путем добавления слэша (/) перед именем тега. Между открывающим и закрывающим тегами находится содержимое тега — контент.

Примеры тегов.

<section>Секция</section>
<p>Абзац</p>
<a>Ссылка</a>
<button>Кнопка</button>

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

<!-- Это комментарий, его содержимое не отобразится на странице -->

<p>Это абзац текста, он будет на странице.</p>

<!--
Комментарий может быть многострочным.
Это удобно для более ёмких описаний.
-->

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

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

<a href="https://google.com">...</a>

<img src="cat.jpg" alt="cute cat" />

<input type="text" name="user_name" />

<button type="submit">...</button>

<p>...</p>

Рассмотрим некоторые атрибуты тега <a>.

<a href="http://google.com" target="_blank" title="Поисковая система Google">
Google. com
</a>
  • href — адрес страницы, на которую перейдёт пользователь при нажатии на текст ссылки.
  • target — указывает то, в какой вкладке откроется страница при клике по ссылке.
  • title — добавляет всплывающую подсказку к тексту ссылки.

Рассмотрим некоторые атрибуты тега <img>.

<img
src="https://picsum.photos/640/480"
alt="Произвольная картинка от генератора"
/>
  • src — адрес изображения.
  • alt — альтернативный текст, который будет показан если картинка не загрузилась.

Полезно

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

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

<!-- Статъя с заголовком и абзацем -->
<article>
<h2>Кратко о парных тегах</h2>
<p>
Большинство тегов парные. Их контент заключён между открывающим и
закрывающим тегом.
</p>
</article>

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

<!-- Метаинформация о кодировке -->
<meta charset="utf-8" />

<!-- Поле ввода -->
<input type="text" />

<!-- Изображение -->
<img src="cat.jpg" alt="cool cat" />

Интересно

В предыдущих стандартах HTML одиночные теги обязательно записывались с обратным символом / перед закрывающей скобкой. Например <img /> или <input />. В современном стандарте это необязательно и ни на что не влияет.

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

<тег1>
<тег2>
<тег4>...</тег4>
<тег5>...</тег5>
</тег2>
<тег3>
<тег6>...</тег6>
</тег3>
</тег1>

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

<p>
<a href="squoosh.app">Squoosh</a> - сервис <em>оптимизации</em> изображений.
</p>

<p>Преимущества</p>
<ul>
<li>Работает в браузере</li>
<li>Не грузит систему</li>
<li>Удобный интерфейс</li>
</ul>

А в этой версии есть проблемы (строки подсвечены).

<!-- Не соблюдается порядок закрытия тегов -->
<p><a href="squoosh.app">Squoosh</a> - сервис <em></a>оптимизации</p> изображений.
</em>

<!-- Не соблюдаются специфические правила вложения тегов -->
<ul>
<p>Преимущества</p>
<li>Работает в браузере</li>
<li>Не грузит систему</li>
<li>Удобный интерфейс</li>
</ul>

Спецификация HTML Living Standard — главный документ, описывающий стандарты, возможности и будущее развитие языка HTML.

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

Полезно

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

Вложенность тегов​

Алгоритм определения возможности вложения тега довольно прост.

  • Идем в спецификацию и находим нужный элемент.
  • Проверяем контентную модель элемента (Content model), в который вкладываем.
  • Проверяем категории элемента (Categories), который вкладываем.
  • Если категория подходит и ограничения не запрещают, то вкладывать можно, иначе нельзя.

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

Справочники​

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

  • Справочник HTML-тегов
  • Справочник CSS-свойств

Примеры использования тегов контента — Acquia Docs

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

Пример из раздела Понимание тегов контента с помощью персонализации приводит к следующую таксономию, которая сопоставляет словарь объекта Drupal Activity с поле Content Section в Personalization и сопоставляет таксономии из ваш объект Drupal в настраиваемые поля в Персонализации:

Сопоставление поля клиента персонализации Поле профиля персонализации Контекст посетителя
Раздел содержания: Деятельность Раздел содержимого Йога, Бег, Сила, Езда на велосипеде, Плавание
Раздел содержания: Местоположение event_udf4 Нью-Йорк, Лос-Анджелес, городской, пригородный
Раздел содержания: Диетические интересы event_udf5 Соки, без глютена, вегетарианские, закуски
Раздел содержания: Интересы красоты event_udf6 Спортивная одежда, Уличный стиль, Натуральные продукты, Сделай сам, Знаменитости
Ключевые слова   Вирус Зика, Ежегодный 5k, Медитация, Деловые поездки

Следующие таблицы содержат примеры отображения из других отраслей, отображение самая важная лексика от сущности Drupal до Раздел содержимого поле в Персонализации и сопоставление таксономий с настраиваемыми полями в Персонализация:

Пример: Американский университет

Сопоставление полей клиента персонализации Поле профиля персонализации Контекст посетителя
Персона   Студент, не студент
Раздел содержимого: Статус Содержание Раздел Будущие, допущенные, действующие, выпускники
Таксономия: Тип школы event_udf4 Бакалавриат, магистратура, продолжение
Таксономия: Местоположение event_udf5 Новая Англия, США, международный
Раздел содержимого: Тип информации event_udf6 Академический, Прием, Студенческая жизнь, Финансовый
Ключевые слова   Начало семестра (добавление или удаление классов, жилье), конец семестра (классы, библиотечных часов), Посещение кампуса, Обучение за рубежом, Трансферы

Пример: компания-разработчик программного обеспечения B2B

Сопоставление полей клиента персонализации Поле профиля персонализации Контекст посетителя
Персона   Текущий клиент, пр.
Раздел содержания: семейство продуктов Раздел содержимого Облачный хостинг, инфраструктура, профессиональные услуги
Раздел содержания: Тип продукта event_udf4 Выделенный хостинг, сеть, хранилище, база данных и анализ данных, Продуктивность и совместная работа
Раздел содержания: тип отрасли event_udf5 Общедоступный, частный, гибридный
Раздел содержания: Промышленность event_udf6 Электронная коммерция, финансы, здравоохранение
Ключевые слова   Federal, Ежегодная конференция, Открытый исходный код, Истории клиентов, Сертификация, соответствие

Пример: Региональный банк

Сопоставление полей клиента персонализации Поле профиля персонализации Контекст посетителя
Персона   Заказчик, проспект
Раздел содержания: Тип клиента Раздел содержимого Деловой, Личный
Раздел содержания: Тип продукта event_udf4 Проверка, инвестирование, кредитные карты, кредиты, страхование
Раздел контента: Life Stage event_udf5 Подросток, Семья, Пенсионер
Раздел содержания: Оценка заемщика event_udf5 Здание, Среднее, Отличное
Ключевые слова   Мобильные приложения, Истории клиентов, Калькулятор, События

Маркировка ресурсов, групп ресурсов и подписок для логической организации — Azure Resource Manager

  • Статья
  • 16 минут на чтение

Теги — это элементы метаданных, которые вы применяете к своим ресурсам Azure. Это пары «ключ-значение», которые помогают вам идентифицировать ресурсы на основе параметров, относящихся к вашей организации. Если вы хотите отслеживать среду развертывания для ваших ресурсов, добавьте ключ с именем Environment. Чтобы определить ресурсы, развернутые в рабочей среде, присвойте им значение «Производство». Полностью сформированная пара ключ-значение становится Среда = Производство.

Вы можете применять теги к своим ресурсам Azure, группам ресурсов и подпискам.

Рекомендации по реализации стратегии тегирования см. в руководстве по именованию и тегированию ресурсов.

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

Предупреждение

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

Важно

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

Значения тегов чувствительны к регистру.

Примечание

В этой статье приведены инструкции по удалению личных данных с устройства или службы, которые можно использовать для поддержки ваших обязательств в соответствии с GDPR. Общие сведения о GDPR см. в разделе GDPR в Центре управления безопасностью Майкрософт и в разделе GDPR на портале Service Trust.

Требуемый доступ

Есть два способа получить требуемый доступ к ресурсам тегов.

  • Вы можете иметь доступ на запись к типу ресурса Microsoft. Resources/tags . Этот доступ позволяет вам пометить любой ресурс, даже если у вас нет доступа к самому ресурсу. Роль участника тегов предоставляет этот доступ. Например, роль участника тегов не может применять теги к ресурсам или группам ресурсов через портал. Однако он может применять теги к подпискам через портал. Он поддерживает все операции с тегами через Azure PowerShell и REST API.

  • Вы можете иметь доступ на запись к самому ресурсу. Роль участника предоставляет необходимый доступ для применения тегов к любому объекту. Чтобы применить теги только к одному типу ресурсов, используйте роль участника для этого ресурса. Например, чтобы применить теги к виртуальным машинам, используйте Virtual Machine Contributor.

PowerShell

Применение тегов

Azure PowerShell предлагает две команды для применения тегов: New-AzTag и Update-AzTag. Вам нужно иметь Модуль Az.Resources версии 1.12.0 или более поздней. Вы можете проверить свою версию с помощью Get-InstalledModule -Name Az. Resources . Вы можете установить этот модуль или установить Azure PowerShell версии 3.6.1 или более поздней версии.

New-AzTag заменяет все теги в ресурсе, группе ресурсов или подписке. Когда вы вызываете команду, передайте идентификатор ресурса объекта, который вы хотите пометить.

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

 $tags = @{"Dept"="Finance"; "Статус"="Нормальный"}
$resource = Get-AzResource -Name demoStorage -ResourceGroup demoGroup
New-AzTag -ResourceId $resource.id -Tag $tags
 

Когда команда завершится, обратите внимание, что ресурс имеет два тега.

 Свойства:
        Имя Значение
        ====== =======
        Департамент финансов
        Состояние нормальное
 

Если вы снова запустите команду, но на этот раз с другими тегами, обратите внимание, что более ранние теги исчезнут.

 $tags = @{"Команда"="Соответствие"; "Окружающая среда"="Производство"}
New-AzTag -ResourceId $resource. id -Tag $tags
 
 Свойства:
        Имя Значение
        =========== ==========
        Окружающая среда Производство
        Соответствие команды
 

Чтобы добавить теги к ресурсу, который уже имеет теги, используйте Update-AzTag . Установите для параметра -Operation значение Merge .

 $tags = @{"Отдел"="Финансы"; "Статус"="Нормальный"}
Update-AzTag -ResourceId $resource.id -Tag $tags -Operation Merge
 

Обратите внимание, что количество существующих тегов увеличивается с добавлением двух новых тегов.

 Свойства:
        Имя Значение
        =========== ==========
        Состояние нормальное
        Департамент финансов
        Соответствие команды
        Окружающая среда Производство
 

Каждое имя тега может иметь только одно значение. Если вы предоставляете новое значение для тега, оно заменяет старое значение, даже если вы используете операцию слияния. В следующем примере тег Status изменяется с Normal на Green .

 $tags = @{"Статус"="Зеленый"}
Update-AzTag -ResourceId $resource.id -Tag $tags -Operation Merge
 
 Свойства:
        Имя Значение
        =========== ==========
        Статус Зеленый
        Департамент финансов
        Соответствие команды
        Окружающая среда Производство
 

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

 $tags = @{"Project"="Электронная коммерция"; "Центр затрат"="00123"; "Команда"="Интернет"}
Update-AzTag -ResourceId $resource.id -Tag $tags -Operation Replace
 

В ресурсе остаются только новые теги.

 Свойства:
        Имя Значение
        ========== =========
        Центр затрат 00123
        Веб-команда
        Электронная коммерция проекта
 

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

Чтобы добавить новый набор тегов в группу ресурсов, используйте:

 $tags = @{"Dept"="Finance"; "Статус"="Нормальный"}
$resourceGroup = Get-AzResourceGroup -Name demoGroup
New-AzTag -ResourceId $resourceGroup.ResourceId -tag $tags
 

Чтобы обновить теги для группы ресурсов, используйте:

 $tags = @{"CostCenter"="00123"; "Окружающая среда"="Производство"}
$resourceGroup = Get-AzResourceGroup -Name demoGroup
Update-AzTag -ResourceId $resourceGroup.ResourceId -Tag $tags -Operation Merge
 

Чтобы добавить в подписку новый набор тегов, используйте:

 $tags = @{"CostCenter"="00123"; "Окружающая среда"="Разработка"}
$subscription = (Get-AzSubscription -SubscriptionName "Пример подписки").Id
New-AzTag -ResourceId "/subscriptions/$subscription" -Tag $tags
 

Чтобы обновить теги для подписки, используйте:

 $tags = @{"Team"="Web Apps"}
$subscription = (Get-AzSubscription -SubscriptionName "Пример подписки"). Id
Update-AzTag -ResourceId "/subscriptions/$subscription" -Tag $tags -Operation Merge
 

В группе ресурсов может быть несколько ресурсов с одинаковым именем. В этом случае вы можете установить каждый ресурс с помощью следующих команд:

 $resource = Get-AzResource -ResourceName sqlDatabase1 -ResourceGroupName examplegroup
$ ресурс | ForEach-Object { Update-AzTag -Tag @{ "Dept"="IT"; "Environment"="Test" } -ResourceId $_.ResourceId -Operation Merge }
 

Список тегов

Чтобы получить теги для ресурса, группы ресурсов или подписки, используйте команду Get-AzTag и передайте идентификатор ресурса объекта.

Чтобы просмотреть теги для ресурса, используйте:

 $resource = Get-AzResource -Name demoStorage -ResourceGroup demoGroup
Get-AzTag-ResourceId $resource.id
 

Чтобы просмотреть теги для группы ресурсов, используйте:

 $resourceGroup = Get-AzResourceGroup -Name demoGroup
Get-AzTag -ResourceId $resourceGroup. ResourceId
 

Чтобы просмотреть теги для подписки, используйте:

 $subscription = (Get-AzSubscription -SubscriptionName "Пример подписки").Id
Get-AzTag -ResourceId "/subscriptions/$subscription"
 

Список по тегу

Чтобы получить ресурсы с определенным именем и значением тега, используйте:

 (Get-AzResource -Tag @{ "CostCenter"="00123"}).Name
 

Чтобы получить ресурсы с определенным именем тега с любым значением тега, используйте:

 (Get-AzResource -TagName "Dept").Name
 

Чтобы получить группы ресурсов с определенным именем и значением тега, используйте:

 (Get-AzResourceGroup -Tag @{ "CostCenter"="00123" }).ResourceGroupName
 

Удалить ярлыки

Чтобы удалить определенные теги, используйте Update-AzTag и задайте для -Operation значение Удалить . Передайте идентификаторы ресурсов тегов, которые вы хотите удалить.

 $removeTags = @{"Project"="Электронная коммерция"; "Команда"="Интернет"}
Update-AzTag -ResourceId $resource.id -Tag $removeTags -Operation Delete
 

Указанные теги удалены.

 Свойства:
        Имя Значение
        ========== =====
        Центр затрат 00123
 

Чтобы удалить все теги, используйте команду Remove-AzTag.

 $subscription = (Get-AzSubscription -SubscriptionName "Пример подписки").Id
Remove-AzTag -ResourceId "/subscriptions/$subscription"
 

Azure CLI

Применение тегов

Azure CLI предлагает две команды для применения тегов: создание тега az и обновление тега az. Вам потребуется версия Azure CLI 2.10.0 или более поздняя. Вы можете проверить свою версию с помощью az version . Чтобы обновить или установить его, см. раздел Установка Azure CLI.

Тег az create заменяет все теги в ресурсе, группе ресурсов или подписке. Когда вы вызываете команду, передайте идентификатор ресурса объекта, который вы хотите пометить.

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

 resource=$(az resource show -g demoGroup -n demoStorage --resource-type Microsoft.Storage/storageAccounts --query "id" --output tsv )
тег az create --resource-id $resource --tags Dept=Финансовый статус=Нормальный
 

Когда команда завершится, обратите внимание, что ресурс имеет два тега.

 "свойства": {
  "теги": {
    "Отдел": "Финансы",
    «Статус»: «Нормальный».
  }
},
 

Если вы снова запустите команду, но на этот раз с другими тегами, обратите внимание, что более ранние теги исчезнут.

 тег az create --resource-id $resource --tags Team=Compliance Environment=Production
 
 "свойства": {
  "теги": {
    «Окружающая среда»: «Производство»,
    «Команда»: «Соответствие»
  }
},
 

Чтобы добавить теги к ресурсу, в котором уже есть теги, используйте az tag update . Установите для параметра --operation значение Merge .

 обновление тега az --resource-id $resource --operation Merge --tags Dept=Finance Status=Normal
 

Обратите внимание, что количество существующих тегов увеличивается с добавлением двух новых тегов.

 "свойства": {
  "теги": {
    "Отдел": "Финансы",
    «Окружающая среда»: «Производство»,
    «Статус»: «Нормальный»,
    «Команда»: «Соответствие»
  }
},
 

Каждое имя тега может иметь только одно значение. Если вы укажете новое значение для тега, новый тег заменит старое значение, даже если вы используете операцию слияния. В следующем примере тег Status изменяется с Normal на Green .

 обновление тега az --resource-id $resource --operation Merge --tags Status=Green
 
 "свойства": {
  "теги": {
    "Отдел": "Финансы",
    «Окружающая среда»: «Производство»,
    «Статус»: «Зеленый»,
    «Команда»: «Соответствие»
  }
},
 

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

 обновление тега az --resource-id $resource --operation Replace --tags Project=ECommerce CostCenter=00123 Team=Web
 

В ресурсе остаются только новые теги.

 "свойства": {
  "теги": {
    «Центр затрат»: «00123»,
    "Проект": "Электронная коммерция",
    «Команда»: «Сеть»
  }
},
 

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

Чтобы добавить новый набор тегов в группу ресурсов, используйте:

 group=$(az group show -n demoGroup --query id --output tsv)
тег az create --resource-id $group --tags Dept=Финансовый статус=Нормальный
 

Чтобы обновить теги для группы ресурсов, используйте:

 az tag update --resource-id $group --operation Merge --tags CostCenter=00123 Environment=Production
 

Чтобы добавить новый набор тегов в подписку, используйте:

 sub=$(az account show --subscription «Демо-подписка» --query id --output tsv)
тег az create --resource-id /subscriptions/$sub --tags CostCenter=00123 Environment=Dev
 

Чтобы обновить теги для подписки, используйте:

 az tag update --resource-id /subscriptions/$sub --operation Merge --tags Team="Web Apps"
 

Список тегов

Чтобы получить теги для ресурса, группы ресурсов или подписки, используйте команду az tag list и передайте идентификатор ресурса объекта.

Чтобы просмотреть теги ресурса, используйте:

 resource=$(az resource show -g demoGroup -n demoStorage --resource-type Microsoft.Storage/storageAccounts --query "id" --output tsv)
список тегов az --resource-id $resource
 

Чтобы просмотреть теги для группы ресурсов, используйте:

 group=$(az group show -n demoGroup --query id --output tsv)
список тегов az --resource-id $group
 

Чтобы просмотреть теги для подписки, используйте:

 sub=$(az account show --subscription "Демо-подписка" --query id --output tsv)
список тегов az --resource-id /subscriptions/$sub
 

Список по тегу

Чтобы получить ресурсы с определенным именем и значением тега, используйте:

 список ресурсов az --tag CostCenter=00123 --query [].name
 

Чтобы получить ресурсы, которые имеют определенное имя тега с любым значением тега, используйте:

 список ресурсов az --tag Team --query []. name
 

Чтобы получить группы ресурсов с определенным именем и значением тега, используйте:

 az group list --tag Dept=Finance
 

Удалить теги

Чтобы удалить определенные теги, используйте Обновить тег az и установить --operation на Удалить . Передайте идентификатор ресурса тегов, которые вы хотите удалить.

 обновление тега az --resource-id $resource --operation Удалить --tags Project=ECommerce Team=Web
 

Вы удалили указанные теги.

 "свойства": {
  "теги": {
    «Центр затрат»: «00123»
  }
},
 

Чтобы удалить все теги, используйте команду удаления тегов az.

 тег az удалить --resource-id $resource
 

Помещения для обработки

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

 обновление тега az --resource-id $group --operation Merge --tags "Cost Center"=Finance-1222 Location="West US"
 

Шаблоны ARM

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

Примечание

Теги, которые вы применяете через шаблон ARM или файл Bicep, перезаписывают любые существующие теги.

Применить значения

В следующем примере развертывается учетная запись хранения с тремя тегами. Два тега ( Dept и Environment ) устанавливаются в буквальные значения. Для одного тега ( LastDeployed ) задан параметр, который по умолчанию соответствует текущей дате.

  • JSON
  • Бицепс
 {
  "$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
  "Версия содержания": "1.0.0.0",
  "параметры": {
    "utcShort": {
      "тип": "строка",
      "defaultValue": "[utcNow('d')]"
    },
    "место расположения": {
      "тип": "строка",
      "defaultValue": "[resourceGroup().location]"
    }
  },
  "Ресурсы": [
    {
      "type": "Microsoft.Storage/storageAccounts",
      "apiVersion": "2021-04-01",
      "name": "[concat('storage', uniqueString(resourceGroup(). id))]",
      "местоположение": "[параметры('местоположение')]",
      "арт": {
        "имя": "Стандарт_LRS"
      },
      "вид": "Хранение",
      "теги": {
        "Отдел": "Финансы",
        «Окружающая среда»: «Производство»,
        "LastDeployed": "[параметры('utcShort')]"
      },
      "характеристики": {}
    }
  ]
}
 

Применить объект

Вы можете определить параметр объекта, который хранит несколько тегов, и применить этот объект к элементу тега. Этот подход обеспечивает большую гибкость, чем предыдущий пример, поскольку объект может иметь разные свойства. Каждое свойство в объекте становится отдельным тегом для ресурса. В следующем примере есть параметр с именем tagValues ​​, который применяется к элементу тега.

  • JSON
  • Бицепс
 {
  "$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
  "Версия содержания": "1. 0.0.0",
  "параметры": {
    "место расположения": {
      "тип": "строка",
      "defaultValue": "[resourceGroup().location]"
    },
    "Значения тегов": {
      "тип": "объект",
      "значение по умолчанию": {
        "Отдел": "Финансы",
        «Окружающая среда»: «Производство»
      }
    }
  },
  "Ресурсы": [
    {
      "type": "Microsoft.Storage/storageAccounts",
      "apiVersion": "2021-04-01",
      "name": "[concat('storage', uniqueString(resourceGroup().id))]",
      "местоположение": "[параметры('местоположение')]",
      "арт": {
        "имя": "Стандарт_LRS"
      },
      "вид": "Хранение",
      "теги": "[параметры('tagValues')]",
      "характеристики": {}
    }
  ]
}
 

Применение строки JSON

Чтобы сохранить несколько значений в одном теге, примените строку JSON, представляющую значения. Вся строка JSON хранится в виде одного тега, длина которого не может превышать 256 символов. В следующем примере есть один тег с именем CostCenter , который содержит несколько значений из строки JSON:

  • . JSON
  • Бицепс
 {
  "$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
  "Версия содержания": "1.0.0.0",
  "параметры": {
    "место расположения": {
      "тип": "строка",
      "defaultValue": "[resourceGroup().location]"
    }
  },
  "Ресурсы": [
    {
      "type": "Microsoft.Storage/storageAccounts",
      "apiVersion": "2021-04-01",
      "name": "[concat('storage', uniqueString(resourceGroup().id))]",
      "местоположение": "[параметры('местоположение')]",
      "арт": {
        "имя": "Стандарт_LRS"
      },
      "вид": "Хранение",
      "теги": {
        "CostCenter": "{\"Отдел\":\"Финансы\",\"Окружающая среда\":\"Производство\"}"
      },
      "характеристики": {}
    }
  ]
}
 

Применение тегов из группы ресурсов

Чтобы применить теги из группы ресурсов к ресурсу, используйте функцию resourceGroup(). Когда вы получите значение тега, используйте синтаксис tags[tag-name] вместо синтаксиса tags. tag-name , так как некоторые символы не обрабатываются правильно в точечной нотации.

  • JSON
  • Бицепс
 {
  "$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
  "Версия содержания": "1.0.0.0",
  "параметры": {
    "место расположения": {
      "тип": "строка",
      "defaultValue": "[resourceGroup().location]"
    }
  },
  "Ресурсы": [
    {
      "type": "Microsoft.Storage/storageAccounts",
      "apiVersion": "2021-04-01",
      "name": "[concat('storage', uniqueString(resourceGroup().id))]",
      "местоположение": "[параметры('местоположение')]",
      "арт": {
        "имя": "Стандарт_LRS"
      },
      "вид": "Хранение",
      "теги": {
        "Отдел": "[resourceGroup().tags['Отдел']]",
        "Среда": "[resourceGroup().tags['Среда']]"
      },
      "характеристики": {}
    }
  ]
}
 

Применение тегов к группам ресурсов или подпискам

Вы можете добавить теги к группе ресурсов или подписке, развернув тип ресурса Microsoft. Resources/tags . Вы можете применить теги к целевой группе ресурсов или подписке, которую хотите развернуть. Каждый раз, когда вы развертываете шаблон, вы заменяете все предыдущие теги.

  • JSON
  • Бицепс
 {
  "$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
  "Версия содержания": "1.0.0.0",
  "параметры": {
    "название тэга": {
      "тип": "строка",
      "defaultValue": "ИмяКоманды"
    },
    "значение тега": {
      "тип": "строка",
      "defaultValue": "КомандаПриложений1"
    }
  },
  "Ресурсы": [
    {
      "type": "Microsoft.Resources/теги",
      "имя": "по умолчанию",
      "apiVersion": "2021-04-01",
      "характеристики": {
        "теги": {
          "[параметры('tagName')]": "[параметры('tagValue')]"
        }
      }
    }
  ]
}
 

Чтобы применить теги к группе ресурсов, используйте Azure PowerShell или Azure CLI. Разверните в группе ресурсов, которую вы хотите пометить.

 New-AzResourceGroupDeployment -ResourceGroupName exampleGroup -TemplateFile https://raw.githubusercontent.com/Azure/azure-docs-json-samples/master/azure-resource-manager/tags.json
 
 группа развертывания az create --resource-group exampleGroup --template-uri https://raw.githubusercontent.com/Azure/azure-docs-json-samples/master/azure-resource-manager/tags.json
 

Чтобы применить теги к подписке, используйте PowerShell или Azure CLI. Разверните подписку, которую вы хотите пометить.

 New-AzSubscriptionDeployment -name tagresourcegroup -Location westus2 -TemplateUri https://raw.githubusercontent.com/Azure/azure-docs-json-samples/master/azure-resource-manager/tags.json
 
 подпрограмма развертывания az create --name tagresourcegroup --location westus2 --template-uri https://raw. githubusercontent.com/Azure/azure-docs-json-samples/master/azure-resource-manager/tags.json
 

Дополнительные сведения о развертывании подписки см. в разделе Создание групп ресурсов и ресурсов на уровне подписки.

Следующий шаблон добавляет теги из объекта либо в группу ресурсов, либо в подписку.

  • JSON
  • Бицепс
 {
  "$schema": "https://schema.management.azure.com/schemas/2018-05-01/subscriptionDeploymentTemplate.json#",
  "Версия содержания": "1.0.0.0",
  "параметры": {
    "теги": {
      "тип": "объект",
      "значение по умолчанию": {
        "ИмяКоманды": "AppTeam1",
        "Отдел": "Финансы",
        «Окружающая среда»: «Производство»
      }
    }
  },
  "Ресурсы": [
    {
      "type": "Microsoft.Resources/теги",
      "apiVersion": "2021-04-01",
      "имя": "по умолчанию",
      "характеристики": {
        "теги": "[параметры('теги')]"
      }
    }
  ]
}
 

Portal

Если у пользователя нет необходимого доступа для применения тегов, вы можете назначить пользователю роль Tag Contributor . Дополнительные сведения см. в разделе Учебник. Предоставление пользователю доступа к ресурсам Azure с помощью RBAC и портала Azure.

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

  2. Чтобы добавить тег, выберите Нажмите здесь, чтобы добавить теги .

  3. Введите имя и значение.

  4. Продолжайте добавлять теги по мере необходимости. Когда закончите, выберите Сохранить .

  5. Теги теперь отображаются в обзоре.

  6. Чтобы добавить или удалить тег, выберите изменить .

  7. Чтобы удалить тег, выберите значок корзины. Затем выберите Сохранить .

Чтобы массово назначить теги нескольким ресурсам:

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

  2. Добавьте имена и значения. Когда закончите, выберите Сохранить .

Чтобы просмотреть все ресурсы с тегом:

  1. В меню портала Azure найдите тегов . Выберите его из доступных вариантов.

  2. Выберите тег для просмотра ресурсов.

  3. Отображаются все ресурсы с этим тегом.

REST API

Для работы с тегами через Azure REST API используйте:

  • Теги — создание или обновление в области действия (операция PUT)
  • Теги — обновление в области действия (операция PATCH)
  • Теги — Get At Scope (операция GET)
  • Теги — Удалить в области действия (операция DELETE)

SDK

Примеры применения тегов с SDK см.:

  • .NET
  • Ява
  • JavaScript
  • Питон

Наследовать теги

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

Теги и выставление счетов

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

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

Сведения об операциях REST API см. в справочнике по REST API выставления счетов Azure.

Ограничения

К тегам применяются следующие ограничения:

  • Не все типы ресурсов поддерживают теги. Чтобы определить, можно ли применить тег к типу ресурса, см. раздел Поддержка тегов для ресурсов Azure.

  • Каждый ресурс, группа ресурсов и подписка могут иметь не более 50 пар «имя-значение» тега. Если вам нужно применить больше тегов, чем максимально допустимое количество, используйте строку JSON для значения тега. Строка JSON может содержать множество значений, которые вы применяете к одному имени тега. Группа ресурсов или подписка может содержать множество ресурсов, каждый из которых имеет 50 пар «имя-значение» тега.

  • Длина имени тега не должна превышать 512 символов, а значение тега не может превышать 256 символов. Для учетных записей хранения имя тега имеет ограничение в 128 символов, а значение тега — 256 символов.

  • Классические ресурсы, такие как облачные службы, не поддерживают теги.

  • Группы IP-адресов Azure и политики брандмауэра Azure не поддерживают операции PATCH. Поэтому операции метода PATCH API не могут обновлять теги через портал.

Оставить комментарий

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

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