ruby-align está disponível na linha de base

Mariko Kosaka
X

Publicado em 21 de fevereiro de 2025

O elemento HTML <ruby> permite exibir anotações fonéticas ou outras informações complementares acima ou ao lado do texto base. É comumente usado em idiomas do leste asiático.

Um elemento <ruby> consiste em duas partes principais: a base de rubi, que é o texto principal, e o texto de rubi, que é o texto da anotação, marcado com o elemento <rt>.


<ruby>
  絵文字
  <rt>emoji</rt>
</ruby>
Anotação Ruby em inglês &quot;Emoji&quot; sobre um texto em japonês.
Pronúncia em inglês como uma anotação sobre o texto base em japonês.

ruby-align

A propriedade CSS ruby-align controla o alinhamento do texto base e do texto de anotação do Ruby. A propriedade aceita um dos valores de palavra-chave space-around, space-between, start e center.

Anotação de ruby de pinyin sobre um texto em chinês.
Imagem mostrando o caso de uso da propriedade ruby-align.