ruby-align

Übersicht

Die ruby-align CSS Eigenschaft definiert die Verteilung der verschiedenen Rubyelemente über die Basis.

Syntax

/* Schlüsselwortwerte */
ruby-align: start;
ruby-align: center;
ruby-align: space-between;
ruby-align: space-around;

/* Globale Werte */
ruby-align: inherit;
ruby-align: initial;
ruby-align: unset;

Werte

start

Ist ein Schlüsselwort, dass angibt, dass die Anmerkung am dem Start des Basistexts ausgerichtet wird.

center

Ist ein Schlüsselwort, dass angibt, dass die Anmerkung mittig am Basistext ausgerichtet wird.

space-between

Ist ein Schlüsselwort, das angibt, dass der zusätzliche Abstand zwischen die Elemente der Anmerkung verteilt wird.

space-around

Ist ein Schlüsselwort, das angibt, dass der zusätzliche Abstand zwischen und um die Elemente der Anmerkung verteilt wird.

Formale Syntax

start | center | space-between | space-around

Beispiele

Dieses HTML wird mit jedem Wert von ruby-align unterschiedlich dargestellt:

<ruby>
  <rb>Dies ist ein langer Text als Beispiel</rb>
  <rp>（</rp><rt>kurzes Ruby</rt><rp>）</rp>
</ruby>

Ruby am Start des Basistexts ausgerichtet

<ruby>
  <rb>Dies ist ein langer Text als Beispiel</rb>
  <rp>（</rp><rt>kurzes Ruby</rt><rp>）</rp>
</ruby>

ruby {
    ruby-align:start;
}

Dies ergibt folgende Ausgabe:

Ruby mittig am Basistext ausgerichtet

<ruby>
  <rb>Dies ist ein langer Text als Beispiel</rb>
  <rp>（</rp><rt>kurzes Ruby</rt><rp>）</rp>
</ruby>

ruby {
    ruby-align:center;
}

Dies ergibt folgende Ausgabe:

Zusätzlicher Abstand verteilt zwischen Rubyelementen

<ruby>
  <rb>Dies ist ein langer Text als Beispiel</rb>
  <rp>（</rp><rt>kurzes Ruby</rt><rp>）</rp>
</ruby>

ruby {
    ruby-align:space-between;
}

Dies ergibt folgende Ausgabe:

Zusätzlicher Abstand verteilt zwischen und um Rubyelemente

<ruby>
  <rb>Dies ist ein langer Text als Beispiel</rb>
  <rp>（</rp><rt>kurzes Ruby</rt><rp>）</rp>
</ruby>

ruby {
    ruby-align:space-around;
}

Dies ergibt folgende Ausgabe:

Spezifikationen

Browser Kompatibilität

Siehe auch

• HTML Ruby Elemente: <ruby>, <rt>, <rp> und <rtc>.
• CSS Ruby Eigenschaften: ruby-position, ruby-merge.