HTML `<ruby>`-Tag

Das <ruby>-Tag definiert eine Ruby-Annotation. Es wird in japanischen und ostasiatischen Sprachen verwendet. Eine Ruby-Annotation ist ein kleiner Zusatztext, der mit dem Haupttext verknüpft ist, um die Bedeutung oder Aussprache der entsprechenden Zeichen anzugeben. Die Ersatzklammern werden im <rp>-Tag platziert. Die Annotation wird in kleiner Schrift über den Zeichen angezeigt.

Das <ruby>-Tag ist eines der HTML5-Elemente.

Sie können das <ruby>-Tag zusammen mit dem <rp>-Tag und/oder <rt> verwenden. Das <ruby>-Tag besteht aus einem oder mehreren Zeichen, die ausgesprochen oder erklärt werden müssen. Das <rt>-Tag liefert diese Informationen, und das <rp>-Tag definiert alternativen Text, der in Browsern angezeigt wird, die das <ruby>-Tag nicht unterstützen.

Syntax

Das <ruby>-Tag wird paarweise verwendet. Der Inhalt wird zwischen dem öffnenden (<ruby>) und dem schließenden (</ruby>) Tag geschrieben.

Beispiel für das HTML `<ruby>`-Tag:

HTML <ruby>-Tag

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 »

Ergebnis

ruby tag example

Attribute

Das <ruby>-Tag unterstützt die Globalen Attribute und die Ereignisattribute.

So stylen Sie ein HTML <ruby>-Tag

css

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

Praxis

Wozu dient das HTML <ruby>-Tag?

Es wird verwendet, um ein Video einzubetten.Es wird verwendet, um Abschnitte in einem Dokument zu erstellen.Es wird verwendet, um dem Text eine Ruby-Annotation hinzuzufügen.Es wird verwendet, um kurze Textabschnitte neben dem Grundtext darzustellen, typischerweise in der ostasiatischen Typografie verwendet, um die Aussprache anzugeben oder eine kurze Annotation bereitzustellen.Es wird verwendet, um ein Bild einzufügen.

HTML <ruby>-Tag ​

Syntax ​

Beispiel für das HTML <ruby>-Tag: ​

Ergebnis ​