Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

<ruby>: Das Ruby-Annotationselement

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.

Das <ruby> HTML-Element steht für kleine Annotationen, die oberhalb, unterhalb oder neben dem Basistext dargestellt werden, meist verwendet, um die Aussprache von ostasiatischen Schriftzeichen zu zeigen. Es kann auch verwendet werden, um andere Arten von Text zu annotieren, aber diese Nutzung ist weniger verbreitet.

Der Begriff ruby entstand als eine Maßeinheit, die von Schriftsetzern verwendet wird und die kleinste Größe repräsentiert, in der Text auf Zeitungspapier gedruckt werden kann, während er lesbar bleibt.

Probieren Sie es aus

<ruby> 明日 <rp>(</rp><rt>Ashita</rt><rp>)</rp> </ruby>
ruby {
  font-size: 2em;
}

Attribute

Dieses Element umfasst nur die globalen Attribute.

Beispiele

Beispiel 1: Zeichen

html
<ruby>
  漢 <rp>(</rp><rt>Kan</rt><rp>)</rp> 字 <rp>(</rp><rt>ji</rt><rp>)</rp>
</ruby>

Ergebnis

Beispiel 2: Wort

html
<ruby> 明日 <rp>(</rp><rt>Ashita</rt><rp>)</rp> </ruby>

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Fluss-Inhalt, Phrasen-Inhalt, greifbarer Inhalt.
Erlaubter Inhalt Eine oder mehrere Gruppen, die jeweils aus zwei Teilen bestehen:
  1. Der Basistext, der entweder ist:
    • Phrasen-Inhalt, jedoch ohne <ruby>-Elemente und ohne <ruby>-Element-Nachkommen, oder
    • Ein einzelnes <ruby>-Element, das selbst keine <ruby>-Element-Nachkommen hat.
  2. Die Annotationen für den Basistext, die entweder sind:
    • Ein oder mehrere <rt>-Elemente, oder
    • Ein <rp>-Element gefolgt von einem oder mehreren <rt>-Elementen, von denen jedes selbst von einem <rp>-Element gefolgt wird (also rp, rt, rp, rt, ..., rp).
Tag-Auslassung Keine, sowohl der Start- als auch der End-Tag sind Pflicht.
Erlaubte Eltern Jedes Element, das Phrasen-Inhalt akzeptiert.
Implizierte ARIA-Rolle Keine entsprechende Rolle
Erlaubte ARIA-Rollen Beliebige
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML
# the-ruby-element

Browser-Kompatibilität

Siehe auch