Атрибут style тега <ruby>

Описание

Атрибут style позволяет задавать CSS-стили непосредственно для элемента <ruby>. Применяется для быстрой инлайновой стилизации ruby-разметки без использования внешних CSS-файлов.

Пример использования:
<ruby style="font-size: 1.5em; color: #d33; line-height: 2;"> 漢 <rp>(</rp><rt style="font-size: 0.7em; color: #666;">かん</rt><rp>)</rp> </ruby>

Особенности применения:

Свойство Пример Эффект
font-size font-size: 1.2em; Размер основного текста
color color: #333; Цвет иероглифов
line-height line-height: 1.8; Расстояние до аннотации

Рекомендуемые стили для ruby:

<ruby style=" font-family: 'MS Mincho', serif; font-size: 24px; line-height: 1.5; "> 日本語 <rp>(</rp><rt style=" font-size: 0.6em; color: #666; font-family: Arial, sans-serif; ">にほんご</rt><rp>)</rp> </ruby>

Ограничения:

  • Инлайновые стили имеют наивысший приоритет (переопределяют CSS-классы)
  • Усложняют поддержку кода (стили "размазаны" по HTML)
  • Не поддерживают медиа-запросы и сложные селекторы
Совет: Для постоянной стилизации используйте CSS-классы. Атрибут style применяйте только для разовых изменений или динамического управления через JavaScript.

Вертикальное письмо:

<div style="writing-mode: vertical-rl; height: 200px;"> <ruby style="margin-right: 1em;"> 漢 <rp>(</rp><rt style="font-size: 0.6em;">かん</rt><rp>)</rp> </ruby> </div>

Примечание: Для сложных проектов с множеством ruby-элементов рекомендуется выносить стили во внешние CSS-файлы или использовать CSS-классы. Инлайновые стили лучше подходят для быстрого прототипирования и единичных случаев.