diff options
Diffstat (limited to 'files/ru/web/html/element/caption/index.html')
-rw-r--r-- | files/ru/web/html/element/caption/index.html | 154 |
1 files changed, 154 insertions, 0 deletions
diff --git a/files/ru/web/html/element/caption/index.html b/files/ru/web/html/element/caption/index.html new file mode 100644 index 0000000000..e678d6a922 --- /dev/null +++ b/files/ru/web/html/element/caption/index.html @@ -0,0 +1,154 @@ +--- +title: '<caption>: The Table Caption element' +slug: Web/HTML/Element/caption +tags: + - Выравнивание + - Заголовок + - Стилизация +translation_of: Web/HTML/Element/caption +--- +<div>{{HTMLRef}}</div> + +<p><span class="seoSummary"><strong>HTML</strong> элемент заголовка таблицы (<strong><code><caption></code></strong>) определяет название (заголовок) таблицы. Если этот элемент используется, он <em>всегда</em> должен быть первым вложенным элементом тэга {{HTMLElement("table")}}.</span> Внешний вид и расположение заголовка по отношению к самой таблице может быть изменено с помощью стилей CSS {{cssxref("caption-side")}} and {{cssxref("text-align")}}.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Категории контента</a></th> + <td>Нет</td> + </tr> + <tr> + <th scope="row">Разрешенное содержимое</th> + <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Потоковый контент</a>.</td> + </tr> + <tr> + <th scope="row">Парность тегов</th> + <td>Конечный тег может быть опущен, если элемент не следует сразу за ASCII пробелом или комментарием.</td> + </tr> + <tr> + <th scope="row">Разрешенные родители</th> + <td>Элемент {{HTMLElement("table")}} как его первый потомок</td> + </tr> + <tr> + <th scope="row">Разрешенные ARIA-роли</th> + <td>Нет</td> + </tr> + <tr> + <th scope="row">DOM interface</th> + <td>{{domxref("HTMLTableCaptionElement")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Атрибуты">Атрибуты</h2> + +<p>Этот элемент включает <a href="/en-US/docs/HTML/Global_attributes">глобальные атрибуты</a>.</p> + +<h3 id="Устаревшие_атрибуты">Устаревшие атрибуты</h3> + +<p>Следующие атрибуты устаревшие и не должны использоваться. Они описаны ниже для справки при обновлении кода и для общего сведения.</p> + +<dl> + <dt>{{htmlattrdef("align")}} {{obsolete_inline}}</dt> + <dd>Этот пронумерованный атрибут указывает как заголовок должен быть выравнен по отношению к таблице. Он может иметь одно или несколько следующих значений : + <dl> + <dt><code>left</code></dt> + <dd>Заголовок отображается слева от таблицы.</dd> + <dt><code>top</code></dt> + <dd>Заголовок отображается над таблицей.</dd> + <dt><code>right</code></dt> + <dd>Заголовок отображается справа от таблицы.</dd> + <dt><code>bottom</code></dt> + <dd>Заголовок отображается под таблицей.</dd> + </dl> + + <div class="note"><strong>Примчание к использованию: </strong>Не используйте этот атрибут, так как он устарел. Элемент {{HTMLElement("caption")}} должен быть стилизован с использованием свойств <a href="/en-US/docs/CSS">CSS</a> {{cssxref("caption-side")}} и{{cssxref("text-align")}}.</div> + </dd> +</dl> + +<h2 id="Примечание_к_использованию">Примечание к использованию</h2> + +<p>Когда элемент {{HTMLElement("table")}}, содержащий <code><caption></code> является единственным потомком элемента {{HTMLElement("figure")}}, вам следует использовать элемент {{HTMLElement("figcaption")}} вместо <code><caption></code>.</p> + +<h2 id="Пример">Пример</h2> + +<p>Просто пример, представляющий таблицу, которая содержит заголовок.</p> + +<pre class="brush: html"><table> + <caption>Example Caption</caption> + <tr> + <th>Login</th> + <th>Email</th> + </tr> + <tr> + <td>user1</td> + <td>user1@sample.com</td> + </tr> + <tr> + <td>user2</td> + <td>user2@sample.com</td> + </tr> +</table></pre> + +<div class="hidden"> +<pre class="brush: css">caption { + caption-side: top; + align: right; +} +table { + border-collapse: collapse; + border-spacing: 0px; +} +table, th, td { + border: 1px solid black; +} +</pre> +</div> + +<p>{{EmbedLiveSample('Example', 650, 100)}}</p> + +<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('HTML WHATWG', 'tables.html#the-caption-element', '<caption>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'tabular-data.html#the-caption-element', '<caption>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/tables.html#h-11.2.2', '<caption>')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Поддержка_браузерами">Поддержка браузерами</h2> + + + +<p>{{Compat("html.elements.caption")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>Другие связанные с таблицей HTML элементы: {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}};</li> + <li>CSS свойства, которые могут быть применены для стилизации элемента {{HTMLElement("caption")}}: + <ul> + <li>{{cssxref("text-align")}}, {{cssxref("caption-side")}}.</li> + </ul> + </li> +</ul> |