→ルビ
>Fet-Fe 細 (→ルビ) |
>Fet-Fe (→ルビ) |
||
| 144行目: | 144行目: | ||
: <ruby lang="zh-TW" style="ruby-position: inter-character;">唐<rt>ㄊㄤˊ</rt>澤<rt>ㄗㄜˊ</rt>貴<rt>ㄍㄨㄟˋ</rt>洋<rt>ㄧㄤˊ</rt></ruby> | : <ruby lang="zh-TW" style="ruby-position: inter-character;">唐<rt>ㄊㄤˊ</rt>澤<rt>ㄗㄜˊ</rt>貴<rt>ㄍㄨㄟˋ</rt>洋<rt>ㄧㄤˊ</rt></ruby> | ||
どうしても再現したいなら、一つの文字毎にrubyタグで囲み、<code>writing-mode: vertical-rl;</code>で[[#縦書き|縦書き]]にする。 | |||
文字が縦方向にガタつくことを防ぐため、ruby属性にはCSSでvertical-align: middle;を指定している。 | |||
下の例では、「唐」の字は<code><ruby style="writing-mode: vertical-rl; vertical-align: middle;">唐<rt>ㄊㄤˊ</rt></ruby></code>で記述されている。他の文字も全く同じようにしている。 | |||
: <span lang="zh-TW"><ruby style="writing-mode: vertical-rl; vertical-align: middle;">唐<rt>ㄊㄤˊ</rt></ruby><ruby style="writing-mode: vertical-rl; vertical-align: middle;">澤<rt>ㄗㄜˊ</rt></ruby><ruby style="writing-mode: vertical-rl; vertical-align: middle;">貴<rt>ㄍㄨㄟˋ</rt></ruby><ruby style="writing-mode: vertical-rl; vertical-align: middle;">洋<rt>ㄧㄤˊ</rt></ruby></span> | |||
ルビを2つ振るには、rubyタグ内でrtcタグ<ref>https://developer.mozilla.org/ja/docs/Web/HTML/Element/rtc</ref>を用いてルビをグループ化する。 | ルビを2つ振るには、rubyタグ内でrtcタグ<ref>https://developer.mozilla.org/ja/docs/Web/HTML/Element/rtc</ref>を用いてルビをグループ化する。 | ||
但しこれも2021年9月7日現在Firefox以外では動作しない。 | 但しこれも2021年9月7日現在Firefox以外では動作しない。 | ||
次の例では<code><ruby>唐澤貴洋<rp>（</rp><rt>たうたくくゐやう</rt><rp>）</rp><rtc><rp>（</rp><rt> | 次の例では<code><ruby>唐澤貴洋<rp>（</rp><rt>たうたくくゐやう</rt><rp>）</rp><rtc><rp>（</rp><rt>だうぢやくくゐやう</rt><rp>）</rp></rtc></ruby></code>と記述している。 | ||
: <ruby>唐澤貴洋<rp>（</rp><rt>たうたくくゐやう</rt><rp>）</rp><rtc><rp>（</rp><rt>だうぢやくくゐやう</rt><rp>）</rp></rtc></ruby> | |||
rubyタグを入れ子にすれば、複数のルビを振ることができる。 | |||
下の例では<code><ruby lang="zh"><ruby style="ruby-position: under; -webkit-ruby-position: after;">唐澤貴洋<rp>（</rp><rt>Тон Зә Гуй Ён</rt><rp>）</rp></ruby><rp>（</rp><rt>táng zé guì yáng</rt><rp>）</rp></ruby></code>と記述している。 | |||
: <ruby lang="zh"><ruby style="ruby-position: under; -webkit-ruby-position: after;">唐澤貴洋<rp>（</rp><rt>Тон Зә Гуй Ён</rt><rp>）</rp></ruby><rp>（</rp><rt>táng zé guì yáng</rt><rp>）</rp></ruby> | |||
2つ目のrubyタグで<code>ruby-position: under;</code>を指定することで、ルビを文字の下に振っている。 | |||
しかしruby-positionは実験的なCSSであり、特にSafariに於いては2021年9月8日現在正式な実装がされていないため、ベンダープレフィックスを付けなければならない<ref>https://developer.mozilla.org/ja/docs/Web/CSS/ruby-position#browser_compatibility</ref>。 | |||
また取ることのできる値もW3Cの定めたものとは異なる。ここでは<code>-webkit-ruby-position: after;</code>と記述している。 | |||
このようになるべく多くのブラウザで挙動を同じくする為には、各ブラウザの対応を確認する必要がある<ref>但しIEのレンダリングが死んでもなんとも思わん</ref>。 | |||
訓民正音が制定された直後の李氏朝鮮では、訛った漢語の読みを正そうという意識の下「{{wpl|東国正韻}}」が定められた。 | 訓民正音が制定された直後の李氏朝鮮では、訛った漢語の読みを正そうという意識の下「{{wpl|東国正韻}}」が定められた。 | ||
その漢字音を広める為に漢字の下に小さい訓民正音で読みを書くという試みが一時期なされていた<ref>[http://www.ls-japan.org/modules/documents/LSJpapers/journals/148_fukui.pdf 福井玲 (2015) 中世韓国語の「傍点」をめぐるいくつかの基本的な課題. 『言語研究』148: 61–80. 日本言語学会.]</ref> | その漢字音を広める為に漢字の下に小さい訓民正音で読みを書くという試みが一時期なされていた<ref>[http://www.ls-japan.org/modules/documents/LSJpapers/journals/148_fukui.pdf 福井玲 (2015) 中世韓国語の「傍点」をめぐるいくつかの基本的な課題. 『言語研究』148: 61–80. 日本言語学会.]</ref>が、当時博く用いられていた音とは異なっていたために受け入れられず、直ぐに廃れた<ref>{{Archive|http://www.tufs.ac.jp/ts/personal/choes/korean/middle/Jmiddle.html|https://archive.ph/vMk10|中期朝鮮語の話 - 趙義成の朝鮮語研究室}}</ref>。 | ||
これをHTML上で表現するにはsubタグを用いれば良い。以下の例では、訓民正音の部分のみをすべてsubタグで囲んでいる。 | これをHTML上で表現するにはsubタグを用いれば良い。以下の例では、訓民正音の部分のみをすべてsubタグで囲んでいる。 | ||