HTML-тег `<ruby>`

Тег <ruby> определяет руби-аннотацию. Он используется в японском и восточноазиатских языках. Руби-аннотация — это небольшой дополнительный текст, связанный с основным текстом для указания значения или произношения соответствующих символов. Фallback-скобки размещаются в теге <rp>. Аннотация отображается мелким шрифтом над символами.

Тег <ruby> является одним из элементов HTML5.

Вы можете использовать тег <ruby> вместе с тегами <rp> и/или <rt>. Тег <ruby> состоит из одного или нескольких символов, которым требуется произношение или пояснение. Тег <rt> предоставляет эту информацию, а тег <rp> определяет альтернативный текст, который отображается в браузерах, не поддерживающих тег <ruby>.

Синтаксис

Тег <ruby> используется парами. Содержимое записывается между открывающим (<ruby>) и закрывающим (</ruby>) тегами.

Пример использования HTML-тега `<ruby>`:

HTML-тег <ruby>

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <ruby>
      明日 <rp>(</rp><rt>Ashita</rt><rp>)</rp>
    </ruby>
  </body>
</html>

Try it Yourself »

Результат

Пример тега ruby

Атрибуты

Тег <ruby> поддерживает глобальные атрибуты и атрибуты событий.

Как стилизовать HTML-тег <ruby>

css

ruby {
  color: blue;
}
rt {
  color: red;
}

Практика

What is the purpose of the HTML <ruby> tag?

It is used to embed a video.It is used to create sections in a document.It is used to add a ruby annotation to the text.It is used to represent short runs of text alongside base text, typically used in East Asian typography to indicate pronunciation or to provide a short annotation.It is used to insert an image.

HTML-тег <ruby> ​

Синтаксис ​

Пример использования HTML-тега <ruby>: ​

Результат ​