前言劉昕好帥

最近在學日文，理所當然地做點筆記放上來，因此有了標註片假名的需求。

然後就發現了 <ruby> 這個 HTML 原生支援的好東西屌 貨。

語法

1
2
3
4
<ruby>
	<rb>我被標註了</rb>
  <rt>他被我標註</rt>
</ruby>

結果為：

我被標註了 他被我標註

不過如果你沒有要特別排版的話，其實 <rb> 可以省略不寫，可以簡單寫成這樣即可：

1
2
<ruby>我被標註了
  <rt>他被我標註</rt></ruby>

範例

痛いたみを感かんじろ

1
2
3
4
5
6
7
8
9
10
<ruby>
	<rb>痛</rb>
	<rt>いた</rt>
</ruby>
	みを
<ruby>
	<rb>感</rb>
	<rt>かん</rt>
	じろ
</ruby>

我guá愛你ài–lí

1
<ruby><rb>我</rb><rt>guá</rt><rb>愛你</rb><rt>ài--lí</rt></ruby>

喪gan心de病piao狂liang

1
2
3
4
5
6
<ruby>
  喪<rt>gan</rt>
  心<rt>de</rt>
  病<rt>piao</rt>
  狂<rt>liang</rt>
</ruby>

劉ㄌㄧㄡˊ昕ㄒㄧㄣ好ㄏㄠˇ帥ㄕㄨㄞˋ

1
2
3
4
5
6
<ruby>
  劉<rt>ㄌㄧㄡˊ</rt>
  昕<rt>ㄒㄧㄣ</rt>
  好<rt>ㄏㄠˇ</rt>
  帥<rt>ㄕㄨㄞˋ</rt>
</ruby>