mozilla

Revision 631003 of <abbr>

  • Revision slug: Web/HTML/Element/abbr
  • Revision title: <abbr>
  • Revision id: 631003
  • Created:
  • Creator: teoli
  • Is current revision? خیر
  • توضیح New pageHTML/Element/abbr Web/HTML/Element/abbr

Revision Content

Аннотация

Элемент <abbr> представляет собой аббревиатуру и, опционально, может показывать её расшифровку. Расшифровка записывается в атрибут title. Иные значения кроме расшифровки аббревиатуры не допускаются.

Примечание: Если присутствует расшифровка, то грамматически она должна соответствовать самой аббревиатуре в текста документа. Это также имеет место в языках с более чем двумя грамматическими числами (например, арабский имеет не только категории единственного и множественного числа, но и "двойную" категорию).

Атрибуты

Этот элемент поддерживает только глобальные атрибуты.

Допускается использование атрибута {{htmlattrdef("title")}} для указания расшифровки аббревиатуры. Большинство браузеров показывают её в виде тултипа (всплывающей подсказки).

Внешний вид по умолчанию

Этот элемент существует чисто для удобства чтения текста, поэтому все браузеры по умолчанию отображают его строчным элементом ({{cssxref('display')}}: inline), хотя и стиль по умолчанию различается в разных браузерах:

  • Некоторые, например, Internet Explorer, никак не стилизуют этот элемент, и внешне он ничем не отличается от элемента {{HTMLElement("span")}}.
  • Opera, Firefox и некоторые другие браузеры добавляют к этому элементу подчеркивание точками.
  • Малая часть браузеров помимо подчёркивания точками также меняют начертание текста на капитель (small caps). Во избежание такого поведения, как вариант, необходимо добавить {{cssxref('font-variant')}}: none в CSS стиль.
Мы настоятельно рекомендуем веб-мастерам не полагаться на стиль по умолчанию. Обратите внимание, что этот элемент не поддерживается Internet Explorer до версии IE7. Так как эти версии IE не поддерживают стилизацию для неизвестных элементов, для поддержки этих версий необходимо применять следующий сценарий:
 
<!--[if lte IE 6]>
  <script>
    document.createElement("abbr");
  </script>
<![endif]-->

Пример

<p>Tony Blair is the prime minister of the <abbr title="United Kingdom">UK</abbr></p>

Что получилось

Image:Abbr.gif

Tony Blair is the prime minister of the UK

 

Спецификации

Спецификация Статус Комментарий
{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-abbr-element', '<abbr>')}} {{Spec2('HTML WHATWG')}}  
{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-abbr-element', '<abbr>')}} {{Spec2('HTML5 W3C')}}  
{{SpecName('HTML4.01', 'struct/text.html#edef-ABBR', '<abbr>')}} {{Spec2('HTML4.01')}}  

Совместимость с браузерами

{{CompatibilityTable}}

Особенность Chrome Firefox (Gecko) Internet Explorer Opera Safari
Поддержка {{CompatAtLeast(2.0)}} {{CompatAtLeastFx(1.0)}} 7.0 {{CompatAtLeast(1.3)}} {{CompatVersionUnknown}}
Особенность Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Поддержка {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}

 

См. также

  • Другие элементы, являющиеся семантически текстовыми: {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.
{{HTMLRef}}

Revision Source

<h2 id="Summary">Аннотация</h2>
<p>Элемент <em><code>&lt;abbr&gt; </code></em>представляет собой <span id="result_box" lang="ru"><span class="hps">аббревиатуру и, опционально, может показывать её расшифровку. </span></span>Расшифровка записывается в атрибут <code><strong>title</strong></code>. Иные значения кроме расшифровки аббревиатуры не допускаются.</p>
<div class="note">
 <p><span id="result_box" lang="ru"><span class="hps"><strong>Примечание</strong>:</span> <span class="hps">Если присутствует расшифровка, то</span> <span class="hps">грамматически она должна соответствовать самой </span><span id="result_box" lang="ru"><span class="hps">аббревиатуре</span></span><span class="hps"> в текста</span> документа<span class="hps">.</span> <span class="hps">Это</span> <span class="hps">также имеет место в</span> <span class="hps">языках</span> <span class="hps">с более чем двумя</span> <span class="hps">грамматическими</span> <span class="hps">числами (например</span><span>, арабский</span> <span class="hps">имеет</span> <span class="hps">не только <span id="result_box" lang="ru"><span class="hps">категории</span></span></span> <span class="hps">единственного и множественного числа</span><span>, но и</span> <span class="hps">"двойную"</span> <span class="hps">категорию</span><span>)</span><span>.</span></span></p>
</div>
<ul class="htmlelt">
 <li><dfn><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Категории контента</a></dfn> <a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Потоковый контент</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">текстовый контент</a> ощущаемый контент</li>
 <li><dfn>Разрешённое содержимое</dfn><a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Текст</a>.</li>
 <li><dfn>Одиночный тег</dfn> {{no_tag_omission}}</li>
 <li><dfn>Разрешённые родительские элементы</dfn> Любые, поддерживающие <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">текст</a>.</li>
 <li><dfn>Интерфейс DOM</dfn> {{domxref("HTMLElement")}} До Gecko 1.9.2 (Firefox 3.6) включительно, Firefox имплементировал интерфейс {{domxref("HTMLSpanElement")}} для этого элемента.</li>
</ul>
<h2 id="Attributes">Атрибуты</h2>
<p><span style="line-height: 21px;">Этот элемент поддерживает только </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">глобальные атрибуты</a><span style="line-height: 21px;">.</span></p>
<p>Допускается использование атрибута {{htmlattrdef("title")}} для указания расшифровки аббревиатуры. Большинство браузеров показывают её в виде тултипа (всплывающей подсказки).</p>
<h2 id="Default_styling">Внешний вид по умолчанию</h2>
<p><span id="result_box" lang="ru"><span class="hps">Этот</span> <span class="hps">элемент</span> существует<span class="hps"> чисто</span> <span class="hps">для удобства</span> чтения текста,<span class="hps"> поэтому</span> <span class="hps">все браузеры</span> <span class="hps"><span id="result_box" lang="ru"><span>по умолчанию </span></span>отображают его</span> строчным элементом ({{cssxref('display')}}<code>: inline</code>)<span>, хотя и</span> <span class="hps">стиль <span id="result_box" lang="ru"><span class="hps">по умолчанию</span></span></span> различается <span class="hps">в разных браузерах</span><span>:</span></span></p>
<ul>
 <li>Некоторые, например, Internet Explorer, никак не стилизуют этот элемент, и внешне он ничем не отличается от элемента {{HTMLElement("span")}}.</li>
 <li>Opera, Firefox и некоторые другие браузеры добавляют к этому элементу подчеркивание точками.</li>
 <li>Малая часть браузеров помимо подчёркивания точками также меняют начертание текста на капитель (small caps). Во избежание такого поведения, как вариант, необходимо добавить {{cssxref('font-variant')}}<code>: none</code> в CSS стиль.</li>
</ul>
<div class="almost_half_cell" id="gt-res-content">
 <div dir="ltr" style="zoom:1">
  <span id="result_box" lang="ru"><span class="hps">Мы настоятельно</span> <span class="hps">рекомендуем</span> <span class="hps">веб-мастерам</span> <span class="hps">не</span> <span class="hps">полагаться на</span> <span class="hps">стиль</span> <span class="hps">по умолчанию.</span> <span class="hps">Обратите внимание, что</span> <span class="hps">этот элемент</span> <span class="hps">не поддерживается</span> <span class="hps">Internet Explorer</span> <span class="hps">до</span> <span class="hps">версии IE7</span><span>.</span> <span class="hps">Так как</span> <span class="hps">эти версии</span> <span class="hps">IE</span> <span class="hps">не поддерживают</span> <span class="hps">стилизацию для</span> <span class="hps">неизвестных элементов</span><span>, для поддержки этих версий необходимо применять следующий сценарий</span><span>:</span></span></div>
 <div dir="ltr" style="zoom:1">
  &nbsp;</div>
</div>
<pre class="brush:html">
&lt;!--[if lte IE 6]&gt;
  &lt;script&gt;
    document.createElement("abbr");
  &lt;/script&gt;
&lt;![endif]--&gt;</pre>
<h2 id="Example">Пример</h2>
<pre class="brush: html">
&lt;p&gt;Tony Blair is the prime minister of the &lt;abbr title="United Kingdom"&gt;UK&lt;/abbr&gt;&lt;/p&gt;
</pre>
<h3 id="Result" name="Result">Что получилось</h3>
<p><img alt="Image:Abbr.gif" src="/@api/deki/files/17/=Abbr.gif" /></p>
<p>Tony Blair is the prime minister of the <abbr title="United Kingdom">UK</abbr></p>
<p>&nbsp;</p>
<h2 id="Specifications" name="Specifications">Спецификации</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('HTML WHATWG', 'text-level-semantics.html#the-abbr-element', '&lt;abbr&gt;')}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-abbr-element', '&lt;abbr&gt;')}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML4.01', 'struct/text.html#edef-ABBR', '&lt;abbr&gt;')}}</td>
   <td>{{Spec2('HTML4.01')}}</td>
   <td>&nbsp;</td>
  </tr>
 </tbody>
</table>
<h2 id="Browser_compatibility">Совместимость с браузерами</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
 <table class="compat-table">
  <tbody>
   <tr>
    <th>Особенность</th>
    <th>Chrome</th>
    <th>Firefox (Gecko)</th>
    <th>Internet Explorer</th>
    <th>Opera</th>
    <th>Safari</th>
   </tr>
   <tr>
    <td>Поддержка</td>
    <td>{{CompatAtLeast(2.0)}}</td>
    <td>{{CompatAtLeastFx(1.0)}}</td>
    <td>7.0</td>
    <td>{{CompatAtLeast(1.3)}}</td>
    <td>{{CompatVersionUnknown}}</td>
   </tr>
  </tbody>
 </table>
</div>
<div id="compat-mobile">
 <table class="compat-table">
  <tbody>
   <tr>
    <th>Особенность</th>
    <th>Android</th>
    <th>Firefox Mobile (Gecko)</th>
    <th>IE Mobile</th>
    <th>Opera Mobile</th>
    <th>Safari Mobile</th>
   </tr>
   <tr>
    <td>Поддержка</td>
    <td>{{CompatVersionUnknown}}</td>
    <td>{{CompatVersionUnknown}}</td>
    <td>{{CompatVersionUnknown}}</td>
    <td>{{CompatVersionUnknown}}</td>
    <td>{{CompatVersionUnknown}}</td>
   </tr>
  </tbody>
 </table>
</div>
<h2>&nbsp;</h2>
<h2 id="See_also">См. также</h2>
<ul>
 <li><span id="result_box" lang="ru"><span class="hps">Другие элементы</span><span>, являющиеся</span> </span><a href="/en-US/docs/HTML/Text_level_semantics_conveying_elements" title="HTML/Text level semantics conveying elements"><span id="result_box" lang="ru"><span class="hps">семантически текстовыми</span></span></a>: {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.</li>
</ul>
<div>
 {{HTMLRef}}</div>
Revert to this revision