---
title: id
slug: Web/SVG/Attribute/id
tags:
  - SVG
translation_of: Web/SVG/Attribute/id
---
<div>{{SVGRef}}</div>

<p>Атрибут <code><strong>id</strong></code> присваивает уникальное имя элементу.</p>

<p>Этот атрибут используется всеми элементами.</p>

<div id="topExample">
<pre class="brush: html notranslate">&lt;svg width="120" height="120" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"&gt;
  &lt;style type="text/css"&gt;
    &lt;![CDATA[
      #smallRect {
        stroke: #000066;
        fill: #00cc00;
      }
    ]]&gt;
  &lt;/style&gt;

  &lt;rect id="smallRect" x="10" y="10" width="100" height="100" /&gt;
&lt;/svg&gt;
</pre>

<p>{{EmbedLiveSample("topExample", "120", "120")}}</p>
</div>

<h2 id="Примечания_по_использованию">Примечания по использованию</h2>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row">Значение</th>
   <td>&lt;id&gt;</td>
  </tr>
  <tr>
   <th scope="row">Значение по умолчанию</th>
   <td><em>Отсутствует</em></td>
  </tr>
  <tr>
   <th scope="row">Анимируемый</th>
   <td>Нет</td>
  </tr>
 </tbody>
</table>

<dl>
 <dt>&lt;id&gt;</dt>
 <dd>
 <p>Задаёт идентификатор элемента. Идентификатор должен быть уникальным в пределах дерева узлов, не должен быть пустой строкой и не должен содержать  никаких пробелов.</p>

 <div class="blockIndicator note">
 <p><strong>Примечание:</strong> Следует избегать использование значений идентификатора, которые будут анализироваться как спецификация представления SVG (например, <code>MyDrawing.svg#svgView(viewBox(0,200,1000,1000))</code>) или базовый фрагмент мультимедиа при использовании в качестве целевого фрагмента URL.</p>
 </div>

 <p>Он должен быть валидным для XML-документов. Автономный документ SVG использует синтаксис XML 1.0, который указывает, что валидные идентификаторы включают только обозначенные символы (буквы, цифры и несколько знаков препинания) и не начинаются с цифры, символа точки (.) или с дефиса (-).</p>
 </dd>
</dl>

<h2 id="Спецификации">Спецификации</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Спецификация</th>
   <th scope="col">Статус</th>
   <th scope="col">Комментарий</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName("SVG2", "struct.html#IDAttribute", "id")}}</td>
   <td>{{Spec2("SVG2")}}</td>
   <td>Более подробно определяет допустимые значения.</td>
  </tr>
  <tr>
   <td>{{SpecName("SVG1.1", "struct.html#IDAttribute", "id")}}</td>
   <td>{{Spec2("SVG1.1")}}</td>
   <td>Исходное определение</td>
  </tr>
 </tbody>
</table>

<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>



<p>{{Compat("svg.attributes.style.class")}}</p>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li><a href="/ru/docs/Web/HTML/Global_attributes/id">HTML <code>id</code></a></li>
 <li>{{SVGAttr("class")}}</li>
</ul>

<div class="jfk-bubble gtx-bubble">
<div class="jfk-bubble-content-id" id="bubble-27">
<div id="gtx-host" style="max-width: 400px;"></div>
</div>

<div class="jfk-bubble-closebtn-id jfk-bubble-closebtn"></div>

<div class="jfk-bubble-arrow-id jfk-bubble-arrow jfk-bubble-arrowdown" style="left: 90px;">
<div class="jfk-bubble-arrowimplbefore"></div>

<div class="jfk-bubble-arrowimplafter"></div>
</div>
</div>