ruby-position

Ограниченная доступность

Эта функция не относится к Baseline, поскольку она не работает во всех наиболее распространённых браузерах.

Свойство ruby-position CSS определяет позицию элемента ruby относительно базового элемента. Он может быть расположен над элементом (over), под ним (under) или между символами справа от них (inter-character).

Попробуйте

Синтаксис

/* Keyword values */
ruby-position: over;
ruby-position: under;
ruby-position: alternate;
ruby-position: alternate over;
ruby-position: alternate under;
ruby-position: inter-character;

/* Global values */
ruby-position: inherit;
ruby-position: initial;
ruby-position: revert;
ruby-position: revert-layer;
ruby-position: unset;

Значения

over: Это ключевое слово, указывающее, что ruby должен быть расположен над основным текстом для горизонтальных скриптов и справа от него для вертикальных скриптов.
under: Это ключевое слово, указывающее, что ruby должен быть расположен под основным текстом для горизонтальных скриптов и слева от него для вертикальных скриптов.
alternate: Это ключевое слово, указывающее, что ruby чередуется между расположением над и под, когда есть несколько уровней аннотаций.
inter-character: При указании он ведет себя как over в вертикальных режимах написания. В противном случае это означает, что ruby должен быть расположен между различными символами, появляясь справа от базового элемента в горизонтальном тексте и принуждая потомков контейнера аннотации ruby иметь режим написания vertical-rl.

Формальное определение

Начальное значение	`alternate`
Применимо к	контейнеры аннотаций ruby
Наследуется	да
Вычисленное значение	как указано
Тип анимации	дискретный

Формальный синтаксис

ruby-position = 
  [ alternate || [ over | under ] ]  |
  inter-character

Примеры

Ruby расположен над текстом

HTML

<ruby>
  <rb>超電磁砲</rb>
  <rp>（</rp><rt>レールガン</rt><rp>）</rp>
</ruby>

CSS

ruby {
  ruby-position: over;
}

Результат

Ruby расположен под текстом

HTML

<ruby>
  <rb>超電磁砲</rb>
  <rp>（</rp><rt>レールガン</rt><rp>）</rp>
</ruby>

CSS

ruby {
  ruby-position: under;
}

Результат

Ruby чередование

HTML

<ruby>
  <rb>A</rb><rb>B</rb><rb>C</rb>
  <rtc>Above</rtc>
  <rtc>Below</rtc>
</ruby>

CSS

ruby {
  ruby-position: alternate; /* this is also the initial value */
}

Результат

Спецификации

Спецификация
CSS Ruby Annotation Layout Module Level 1 # rubypos

Совместимость браузеров

	Рабочий стол					Мобильный телефон
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`ruby-position`	84 1 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).	84 79 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`). 12–79	38	70 15 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).	18.2 7 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).	84 18 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).	38	60 14 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).	18.2 7 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).	14.0	84 4.4 Реализовано как нестандартная, префиксная версия `ruby-position`, `-webkit-ruby-position`: она имеет два свойства: `before` и `after` (оба эквивалентны, для шрифтов ltr и rtl, стандартному значению `over` используемому с `ruby-align: start`).
`alternate`	Нет	Нет	88	Нет	Нет	Нет	88	Нет	Нет	Нет	Нет
`inter-character`	84 Это значение поддерживается только с префиксной версией свойства.	84 Это значение поддерживается только с префиксной версией свойства.	Нет	70 Это значение поддерживается только с префиксной версией свойства.	18.2	84 Это значение поддерживается только с префиксной версией свойства.	Нет	60 Это значение поддерживается только с префиксной версией свойства.	18.2	14.0 Это значение поддерживается только с префиксной версией свойства.	84 Это значение поддерживается только с префиксной версией свойства.
`over`	84	84	≤72	70	18.2	84	79	60	18.2	14.0	84
`under`	84	84	≤72	70	18.2	84	79	60	18.2	14.0	84

См. также

<ruby>, <rt>, <rp>, и <rtc> элементы HTML
ruby-align

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/ruby-position