Template:Ruby

{{{1}}}{{{2}}}
This template allows you to mark a paragraph of small characters on a specific text, which is often used for Chinese phonetic transcription, Japanese Kanji to mark hiragana, Korean characters to mark Chinese proverbs, and so on, and can also be used to speak in reversejoke.

Usage

{{Ruby|characters|small characters above|Language label of text|Phonetic Language Label}}

Usage Examples

Code	Effect	Explain
{{Ruby|注|zhù}}{{Ruby|音|yīn}}	注zhù音yīn	Add phonetic transcription to Chinese.
{{Ruby|運命|さだめ}}	運命さだめ	Japanese Kanji to mark hiragana.
{{Ruby|超电磁炮|レールガン}}	超电磁炮レールガン	Translate words from another language.
{{Ruby|충|忠}}！{{Ruby|성|誠}}！	충忠！성誠！	Korean mark 한언.
A bicycle can't stand on it's own because it is {{Ruby|two-tyredmeet|too tired}}.	A bicycle can't stand on it's own because it is two-tyredmeettoo tired.	Play a little joke.

Be careful

Template itself

• This template cannot be nested repeatedly for itself, which will cause errors.
• Please try to avoid using this template to typeset long sentence content and translation, and use the shortest unit (such as word or syllable) for typesetting when annotating words. Too long typesetting may lead to accidents such as the narrow screen device cannot change lines; This template is not specially designed for translation content. Where the original text and translation need to appear together, please consider directly using brackets to indicate.

Pleasedon't don't don't don't don't don't don't don'tdon't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't don't compose type like this.

Browser

At present, only some browsers support the style of this template. Please pay attention to the compatibility of your browser before use.

• If you see smaller text above the text, your browser is compatible with the style.
• Firefox 34~37 can open theabout:configpage, and change thelayout.css.ruby.enabledparameter totrueto enable the phonetic effect.

See：

• Can I use... The browser compatibility list here
• Instructions about<ruby>on the Mozilla developer website

Table class

Phenomenon description

The use of this template in table, li and other elements may cause some alignment problems, which is due to the rendering method. When the number of elements in the column is not uniform, different width allocation methods will lead to different height allocation (webkit will give a reasonable space to block elements). This problem only occurs when the width is automatically allocated. If the width is specified, this problem will not occur.

This kind of problem can also occur in templates such as {{LyricsKai}}, especially various templates that depend on table. LyricsKai: If the corresponding rows in the left and right columns do not use ruby at the same time, this problem will occur.

Title Text	Title Text	Title Text
100px width, an exception is triggered when the line breaks	150px width	示例test：Ruby tag, automatically adjust the width, display exceptions, and the cell will float up several pixels
100px width	示例test：150px width. If the width is written to dead, no exception will be triggered	After the div tag is attached, 示例test: ruby tag automatically adjusts the width and displays normally

Resolvent

Put a div tag on Ruby.

{| class="wikitable" 
|-
! Title Text !! Title Text !! Title Text
|-
| width=100px|100px width, an exception is triggered when the line breaks || width=150px|150px width || {{ruby|示例|test}}：Ruby tag, automatically adjust the width, display exceptions, and the cell will float up several pixels
|-
| 100px width || {{ruby|示例|test}}：150px width. If the width is written to dead, no exception will be triggered || <div>After the div tag is attached, {{ruby|example|test}}： ruby tag automatically adjusts the width and displays normally</div>
|}