This tutorial will teach you how to use this Cantonese romanization HTML markup tool to mark up Chinese characters with Jyutping or Yale Cantonese
Enter corresponding romanization in the first input box.
Enter Chinese characters in the second input box.
After you have copied those HTML code, you can then write your own CSS code to design it.
This Cantonese romanization HTML markup tool can help you mark up Chinese characters in Jyutping or Yale, in order to promote either form of Cantonese romanization.
Since some Chinese characters are multibyte, markup tools for Japanese or other language would not work for Cantonese.
Besides, unlike other markup tools, this markup tools use
<span> instead of
<rt> for markup, in order to fix the layout issue and overcome the design constraint for
<ruby> with CSS.
Lastly, this markup tool marks up words by words, instead of marking up the whole sentence, so that you can prevent layout issue when the some romanization are particularly long or short.