Тег rp (от английского ruby parenthesis, «скобка для ruby») записывает запасной вариант для аннотации: скобки вокруг текста из rt. Если аннотацию не удаётся вывести над основой, она попадает в строку, и скобки отделяют её от основы. Тег парный, собственных атрибутов у него нет.
В современном браузере rp не виден: скобки скрыты, и читатель замечает только аннотацию над основой. Поэтому тег проверяют по тексту без разметки, а не на своём экране. Порядок записи и сами аннотации разобраны на страницах про ruby и про rt.
<ruby>
猫<rp>(</rp><rt>ねこ</rt><rp>)</rp>
</ruby>В этой статье
Тег rp в HTML: что это и для чего нужен
По описанию спецификации, rp допустим только внутри ruby, рядом с rt: перед ним или после него, а содержимым служит только текст. Внутри ruby он «представляет ничего», а вне ruby - своё содержимое. Задача тега - сохранить читаемую запись там, где ruby не рисуется.
В Chrome rp скрыт правилом display: none. По данным справки MDN, тег ruby доступен во всех современных браузерах с 2015 года, поэтому сегодня rp - страховка, а не обязательная часть записи.
У страховки есть и другая польза, видная в тексте без разметки. У записи со скобками свойство textContent даёт «猫(ねこ)», а без скобок - «猫ねこ»: скобки читаются там, где аннотацию над основой не нарисовать. О копировании текста написано на странице про ruby.
Как записать тег rp: скобки, пробелы и закрывающий тег
Каждый rt обрамляют двумя rp: открывающая скобка перед ним, закрывающая после. Внутри rp записывают только текст.
<ruby>
東<rp>(</rp><rt>とう</rt><rp>)</rp>
京<rp>(</rp><rt>きょう</rt><rp>)</rp>
</ruby>Вид скобок выбирают по языку текста: для японского подходят полноширинные «（» и «）», для русского и латиницы - обычные круглые. Пробел внутри rp добавляют, если аннотация должна отделяться от основы, например <rp> (</rp>.
Закрывающий тег можно не писать перед rt или другим rp и в конце ruby: парсер достроит его сам, как у rt. Запись с закрывающим тегом яснее, поэтому в примерах он всегда есть.
Что увидит читатель без ruby: тег rp в старом браузере
Проверить запасной вариант в современном браузере нельзя: он умеет ruby. Кадр ниже имитирует браузер без поддержки: превращает ruby, rt и rp в обычные строчные элементы, как их показал бы браузер, не знающий эти теги. Это имитация, а не запуск старого браузера.
Разница видна сразу. С rp получается «猫(ねこ)»: чтение отделено скобками. Без него получается «猫ねこ», и читатель не понимает, где основа, а где чтение.
Пример: запись без поддержки ruby и с ней
Переключайте браузер и запись. Кадр показывает вид, разметку и текст в строке.
Скобки можно вывести и в современном браузере: достаточно задать rp { display: inline; }. Тогда рядом с аннотацией над основой появляются и скобки. Так проверяют, какие скобки записаны, и оформляют их цветом.
rp {
display: inline;
color: #c0292e;
}Пример: скобки rp, показанные через CSS
Выбирайте стиль. Кадр читает значение display, которое применил браузер, и текст в строке.
Тег rp вне ruby и содержимое rp: где Chrome его скрывает
Спецификация разделяет два случая: внутри ruby тег rp не представляет ничего, вне ruby представляет своё содержимое. Chrome этой разницы не делает: правило display: none действует на rp везде, и текст вне ruby тоже скрыт. В замере запись 猫<rp>(</rp>ねこ<rp>)</rp> вне ruby дала в строке «猫ねこ» без скобок, а textContent вернул «猫(ねこ)».
Стандарт разрешает внутри rp только текст, но парсер Chrome оставляет вложенные теги, например em. Они попадают в дерево и скрываются вместе с rp, поэтому вложенные теги записывать не нужно. Атрибуты у rp только глобальные: title принимается, но у скрытого элемента подсказки не видно.
Пример: где скрыт rp
Выберите запись. Кадр читает display, видимый текст и textContent.
Частые ошибки с тегом rp
Ошибки с этим тегом связаны со скобками, местом записи и ожиданием, что rp виден.
| Ошибка | Что происходит | Как исправить |
|---|---|---|
Скобки обычным текстом: <ruby>猫(ねこ)</ruby> | Скобки видны всегда, а аннотации над основой нет | Записать rt и обрамить его двумя rp |
Одна скобка: 猫<rp>(</rp><rt>ねこ</rt> | В старом браузере получится «猫(ねこ» без закрывающей скобки | Открывающий rp перед rt, закрывающий после |
Аннотация внутри rp: <rp>ねこ</rp> | Браузер с ruby скрывает rp, и читатель не увидит аннотацию | Аннотацию записать в rt, а в rp записать скобки |
rp вне ruby | Chrome скрывает его везде, а стандарт вне ruby обещает вывод содержимого: результат не совпадает | Записывать rp только внутри ruby рядом с rt |
Вложенный тег в rp: <rp><em>(</em></rp> | Стандарт разрешает только текст, вложенный тег скрыт вместе с rp | Записать в rp только текст |
Ожидание, что rp виден в Chrome | Chrome скрывает rp правилом display: none | Проверять запасной вариант в имитации или через rp { display: inline; } |
