Изучаем HTML 5-Б. Лоусон, Р. Шарп - 2011 |
Страница 69 из 244 Текст • 83 меров нерегулярного или неоднозначного произношения таких знаков — имена людей и названия мест. В может произноситься как «nichi», «hi» или «ка». ^ может произноситься как «Ьоп» или «moto». В ^ может произноситься как «nihon» или «nippon». Чтобы текст был более понятным для читателя, иногда над знаком кандзи пишется его произношение, и при этом используется хирагана. По-японски это называется фуригана, а по-английски — ruby (от названия мелкого шрифта размером 5,5 пт, использующегося в британской типографской традиции для подобного рода аннотаций). Такой шрифт часто используется в газетах и книгах, но на сайтах он встречается редко, поскольку не так просто разместить мелкий текст над обычным в пределах одной строки. Элемент <ruby> создан для того, чтобы решить эту проблему. Согласно текущей спецификации HTML5, элемент <ruby> — это строковый элемент, содержащий слово (или знак), которое вы хотите уточнить. Это может выглядеть так: <ruby> 0 ^</ruby> Сам по себе такой код не делает ничего. Поэтому мы добавим произношение либо к каждому знаку, либо (как в нашем примере, и я рекомендую вам поступать именно так) к целому слову. Для этого будем использовать тег <rt>, который обозначает текст <ruby>. <ruby> 0 ^<rt>lrj5Ay</rt></ruby> Если оставить это в таком виде, браузеры, поддерживающие этот элемент, отобразят произношение над текстом кандзи, но остальные браузеры проигнорируют теги и отобразят и текст, и произношение на одной строке в линейном порядке. Чтобы решить эту проблему, добавим специальные скобки с помощью тега < гр>» который разумно скрывает эти скобки в браузерах, поддерживающих элемент ruby. Это означает, что вы можете писать произношение в скобках, которые будут отображаться в браузерах, не поддерживающих ruby, тогда как остальные браузеры отобразят произношение без скобок над основным текстом (рис. 2.20).  Рис. 2.20.В браузерах, поддерживающих ruby, текст-транскрипция отображается над основным текстом. В браузерах, не поддерживающих ruby, текст-транскрипция отображается в скобках и следует после основного текста |