|
| 1 | +<!DOCTYPE html> |
| 2 | +<html lang="zh-hans"> |
| 3 | +<head> |
| 4 | +<meta charset="utf-8"> |
| 5 | +<title>行间注（Ruby）</title> |
| 6 | +<meta name="description" content="什么是行间注？"> |
| 7 | +<script> |
| 8 | +var f = { } |
| 9 | + |
| 10 | +// AUTHORS should fill in these assignments: |
| 11 | +f.directory = 'questions'+'/' // the path to this file, not including /International or the file name |
| 12 | +f.filename = 'qa-ruby' // the file name WITHOUT extensions |
| 13 | +f.authors = 'Richard Ishida, W3C' // author(s) and affiliations |
| 14 | +f.previousauthors = '' // as above |
| 15 | +f.modifiers = '' // people making substantive changes, and their affiliation |
| 16 | +f.searchString = 'qa-ruby' // blog search string - usually the filename without extensions |
| 17 | +f.firstPubDate = '2005-07-21' // date of the first publication of the document (after review) |
| 18 | +f.lastSubstUpdate = { date:'2016-02-10', time:'15:23'} // date and time of latest substantive changes to this document |
| 19 | +f.status = 'published' // should be one of draft, review, published, notreviewed or obsolete |
| 20 | +f.path = '../' // what you need to prepend to a URL to get to the /International directory |
| 21 | + |
| 22 | +// AUTHORS AND TRANSLATORS should fill in these assignments: |
| 23 | +f.thisVersion = { date:'2025-06-27', time:'15:23'} // date and time of latest edits to this document/translation |
| 24 | +f.contributors = '' // people providing useful contributions or feedback during review or at other times |
| 25 | +f.sources = 'Some of the text related to jukugo ruby is taken from the blog post <cite><a href="https://r12a.github.io/blog/201002.html#20100924">What\'s so difficult about jukugo ruby?</a></cite>' // describes sources of information |
| 26 | +// also make sure that the lang attribute on the html tag is correct! |
| 27 | + |
| 28 | +// TRANSLATORS should fill in these assignments: |
| 29 | +f.translators = '薛富侨' // translator(s) and their affiliation - a elements allowed, but use double quotes for attributes |
| 30 | + |
| 31 | +f.breadcrumb = 'markup' |
| 32 | + |
| 33 | +f.additionalLinks = '' |
| 34 | +</script> |
| 35 | +<script src="qa-ruby-data/translations.js"> </script> |
| 36 | +<script src="../javascript/doc-structure/article-dt.js"> </script> |
| 37 | +<script src="../javascript/boilerplate-text/boilerplate-zh-hans.js"> </script> |
| 38 | +<!--TRANSLATORS must change -en in the line just above to the subtag for their language! --> |
| 39 | +<script src="../javascript/doc-structure/article-2022.js"> </script> |
| 40 | +<script src="../javascript/articletoc-2022.js"></script> |
| 41 | +<link rel="stylesheet" href="../style/article-2022.css"> |
| 42 | +<link rel="copyright" href="#copyright"> |
| 43 | +<link rel="stylesheet" href="qa-ruby-data/local.css"> |
| 44 | +</head> |
| 45 | + |
| 46 | +<body> |
| 47 | +<header> |
| 48 | + <nav id="mainNavigation"></nav><script>document.getElementById('mainNavigation').innerHTML = mainNavigation</script> |
| 49 | + |
| 50 | + <h1>什么是行间注？</h1> |
| 51 | +</header> |
| 52 | + |
| 53 | + |
| 54 | + <div id="audience"> |
| 55 | + <div id="updateInfo"></div><script>document.getElementById('updateInfo').innerHTML = g.updated</script> |
| 56 | + </div> |
| 57 | + |
| 58 | +<section id="question"> |
| 59 | +<h2>问题</h2> |
| 60 | + <p class="question">什么是行间注（ruby）？</p> |
| 61 | +</section> |
| 62 | + |
| 63 | + |
| 64 | +<section id="nutshell"> |
| 65 | + <h2 id="quickanswer">简要回答</h2> |
| 66 | +<p><dfn id="def_ruby">行间注</dfn>（ruby）是标注在字词旁侧的小字号补充文本。这对日文和其他东亚文字内容特别有用（行间注在日文中也叫振假名）。</p> |
| 67 | + <p>HTML规范提供了标记行间注的方法，CSS可用于微调行间注的位置。</p> |
| 68 | +</section> |
| 69 | + |
| 70 | + |
| 71 | +<section id="detail"> |
| 72 | +<h2>详细信息</h2> |
| 73 | + <p><span class="qterm">ruby</span>这个名称源于英国排字工使用的一种字号（约为正常10磅字体的一半）。</p> |
| 74 | + <p>通常，行间注在东亚文字中用于为生僻字进行标音，为读者不熟悉的字（如儿童或学习书写的外国人）或具有多种读音且无法通过上下文确定的字（如一些日文姓名）提供注音。比如，行间注广泛用于教育材料和儿童读物中。</p> |
| 75 | + <p>行间注偶尔也用于传达表意字符的含义信息。</p> |
| 76 | + <p>在日文中，行间注通常称为振假名，标音通常以平假名的形式出现，在横排文本的上方，直排文本的右侧。</p> |
| 77 | + <p>在用于表达语义信息的罕见情况下，日文行间注可以出现在横排文本的下方，直排文本的左侧。</p> |
| 78 | + <p>如下例所示，可以为同一段基文同时标注音和义的行间注。</p> |
| 79 | + <div class="sidenoteGroup"> |
| 80 | + <figure> |
| 81 | + <p style="float: left;"><img src="qa-ruby-data/vertical.png" alt="直排下的日文行间注" style="margin-right: 3em;"> </p> |
| 82 | + <p style="float: left;"><img src="qa-ruby-data/double-sided.png" alt="横排下的日文行间注"> </p> |
| 83 | + <figcaption style="clear:left;">日文中直排和横排行间注的示例</figcaption> |
| 84 | + </figure> |
| 85 | + <!-- For the Japanese examples i used ruby { font-size: 75px; font-family: "ms mincho";} --> |
| 86 | + <div class="sideinfonote"> |
| 87 | + <p class="info">示例中的行间注显示为红色仅是为了引起你的注意——行间注通常与基文颜色相同。</p></div> |
| 88 | + </div> |
| 89 | + <p>尽管日文中的行间注通常用平假名书写，但偶尔也会有汉字、片假名（特别是在日文漫画中）和拉丁字母的行间注。</p> |
| 90 | + <figure><p> |
| 91 | + <img src="qa-ruby-data/mixed-script1.gif" alt="片假名注释" style="float:left; margin-right: 2em;"> |
| 92 | + <img src="qa-ruby-data/mixed-script2.gif" alt="汉字注释" style="float:left; margin-right: 2em;"> |
| 93 | + <img src="qa-ruby-data/mixed-script3.gif" alt="拉丁字母注释" style="float:left;"> |
| 94 | + </p> |
| 95 | + <figcaption style="clear:both;">使用片假名、汉字和拉丁字母的行间注示例。</figcaption> |
| 96 | + </figure> |
| 97 | + <p>在中国大陆，通常在每个字的上方或下方标注拼音。</p> |
| 98 | + <figure> |
| 99 | + <p><img src="qa-ruby-data/pinyin.png" alt="中国话(zhōng guó huà)" width="263" height="131"> </p> |
| 100 | + <!--p><ruby><rb>中</rb><rt>zhōng</rt><rb>国</rb><rt>guó</rt><rb>话</rb><rt>huà</rt></ruby--> |
| 101 | + <figcaption>简体中文的拼音标音</figcaption> |
| 102 | + </figure> |
| 103 | + <p>繁体中文中的行间注通常使用<a class="termref" href="https://zh.wikipedia.org/wiki/%E6%B3%A8%E9%9F%B3%E7%AC%A6%E8%99%9F">注音符号</a>来标注发音。无论基文是直排还是横排，注音符号都出现在每个字的右侧。</p> |
| 104 | + <p>注意：虽然声调符号不是组合字符，但它们出现在注音符号列的右侧。</p> |
| 105 | + <figure> |
| 106 | + <!--p><img src="qa-ruby-data/bopomofo.gif" alt="An example of ruby in Traditional Chinese script" width="359" height="115"> </p--> |
| 107 | + <p style="float: left;"><img src="qa-ruby-data/bopomofo-vertical.gif" alt="第十屆(ㄉㄧˋㄕˊㄐㄧㄝˋ)在直排下的行间注" style="margin-right: 3em;"> </p> |
| 108 | + <p style="float: left;"><img src="qa-ruby-data/bopomofo.gif" alt="第十屆(ㄉㄧˋㄕˊㄐㄧㄝˋ)在横排下的行间注"> </p> |
| 109 | + <figcaption style="clear:both;">繁体中文基文的行间注</figcaption> |
| 110 | + </figure> |
| 111 | +</section> |
| 112 | + |
| 113 | +<section id="types"> |
| 114 | +<h2>行间注的分类</h2> |
| 115 | + <p><cite><a href="#endlinks">日文排版需求</a></cite>文档描述了行间注的三种不同行为方式。</p> |
| 116 | + |
| 117 | + <section id="mono"> |
| 118 | +<h3>单字行间注</h3> |
| 119 | + <p>单字行间注（mono ruby）通常用于文本的标音。</p> |
| 120 | + <p>在<dfn id="def_mono_ruby">单字行间注</dfn>中，行间注位于单个基文汉字旁。在这种情况下，一般不会注文通常不会跨越到相邻汉字旁，尽管这可以通过样式进行调整。请注意，在下图中，单个汉字的注文通常在其基文字符上方居中，在注文两侧留出小间隙，而三个字符的注文会强制基文汉字与其邻字拉开一些距离。</p> |
| 121 | + <figure> |
| 122 | + <p><img src="qa-ruby-data/mono.png" alt="茅場町(かやばちょう)的单字行间注"></p> |
| 123 | + <figcaption style="clear:left;">日文中的单字行间注</figcaption> |
| 124 | + </figure> |
| 125 | + <p>你可以在任何地方拆分使用单字行间注的词，行间注会与其基文汉字保持在一起。</p> |
| 126 | + </section> |
| 127 | + |
| 128 | + <section id="group"> |
| 129 | +<h3>分词连写行间注</h3> |
| 130 | + <p><dfn id="def_group_ruby">分词连写行间注</dfn>（group ruby）用于发音无法对应到单个基文汉字的情况，或用于跨越整个基文的语义性注释。下图显示了一个日文词的示例，基文中的每个汉字都没有独立的发音。注文作为一个整体应用于两个基文汉字。</p> |
| 131 | + <figure> |
| 132 | + <p><img src="qa-ruby-data/group.png" alt="今日(きょう)的分词连写行间注"></p> |
| 133 | + <figcaption style="clear:left;">日文中的分词连写行间注</figcaption> |
| 134 | + </figure> |
| 135 | + <p>换行时，使用分词连写行间注的文本不能拆分，必须作为一个整体换行。</p> |
| 136 | + </section> |
| 137 | + |
| 138 | + <section id="jukugo"> |
| 139 | +<h3>熟语行间注</h3> |
| 140 | + <p><dfn id="def_jukugo">熟语</dfn>指的是日文复合名词，即由多个汉字组成的词，如<span lang="ja">調理師</span>（厨师）。</p> |
| 141 | + <p><dfn id="def_jukugo_ruby">熟语行间注</dfn>是一个术语，用于描述有时表现得像分词连写行间注，有时表现得像单字行间注的注释。我们会详细描述熟语行间注，因为人们经常不太理解这种行间注。</p> |
| 142 | + <p>熟语行间注的行为类似于单字行间注，因为注文和与单个基文汉字之间存在强关联。当你在行末拆分一个词时，这一点会变得清楚：你会看到行间注被拆分，使得注释特定基文汉字的注文与该汉字保持在一起。熟语行间注的不同之处在于，当词在行末<strong>没被拆分</strong>时，注文可能延伸至相邻基文汉字旁。</p> |
| 143 | + <figure style="float:right; margin-left: 20px; margin-bottom: 20px;"><img src="qa-ruby-data/jukugo1.png" alt="行间注示例"> |
| 144 | + <figcaption style="width: 242px;">熟语行间注</figcaption> |
| 145 | + </figure> |
| 146 | +<p>右侧的图片包含三个熟语行间注的示例。</p> |
| 147 | +<p>在前两个示例中，效果与单字行间注相同，因为没有基文汉字和与该汉字无关的注文重叠。</p> |
| 148 | +<p>第三个例子显示出了<span class="qterm">熟语行间注</span>的差异。注文的前三个字符与第一个汉字相关联，最后一个注文字符与第二个汉字相关联。然而注文却在两个汉字上均匀分布。</p> |
| 149 | +<p>但是请注意（这是一个重要的区别！），我们并不是像分词连写行间注那样简单地将注文分布到整个词上，而是有具体的规则，在某些情况下会出现间隙。请看以下熟语行间注分布的示例：</p> |
| 150 | +<figure> |
| 151 | +<img src="qa-ruby-data/jukugo2.png" style="margin:auto;" alt="各种熟语行间注示例。"> |
| 152 | +<figcaption>熟语行间注的分布，在某些地方显示间隙。</figcaption> |
| 153 | +</figure> |
| 154 | +<p>还要注意，如果第三个词在行末被拆分，使第二个汉字移动到下一行，只有最后一个平假名字符会随之移动，所以还是看起来像单字行间注。</p> |
| 155 | + </section> |
| 156 | +</section> |
| 157 | + |
| 158 | + |
| 159 | +<section id="endlinks"> |
| 160 | +<h2>延伸阅读</h2> |
| 161 | +<aside class="section" id="survey"> </aside><script>document.getElementById('survey').innerHTML = g.survey</script> |
| 162 | + |
| 163 | + <ul id="full-links"> |
| 164 | + <li> |
| 165 | + <p><cite>日文排版需求</cite></p> |
| 166 | + <ul> |
| 167 | + <li><a href="/TR/jlreq/#ruby_and_emphasis_dots">行间注与着重号的处理</a></li> |
| 168 | + <li><a href="/TR/jlreq/#positioning_of_jukugoruby">熟语行间注的排版</a></li> |
| 169 | + </ul> |
| 170 | + </li> |
| 171 | + <li> |
| 172 | + <p><cite><a href="https://r12a.github.io/scripts/bopomofo/ontheweb">Web上的注音符号</a></cite></p> |
| 173 | + </li> |
| 174 | + <li> |
| 175 | + <p><cite>制作网页</cite></p> |
| 176 | + <ul> |
| 177 | + <li><a href="/International/techniques/authoring-html#ruby">使用ruby标记</a></li> |
| 178 | + <li><a href="/International/techniques/authoring-html#rubystyle">设计行间注样式</a></li> |
| 179 | + </ul> |
| 180 | + </li> |
| 181 | + |
| 182 | + </ul> |
| 183 | +</section> |
| 184 | + |
| 185 | +<footer id="thefooter"></footer><script>document.getElementById('thefooter').innerHTML = g.bottomOfPage</script> |
| 186 | +<script>completePage()</script> |
| 187 | +</body> |
| 188 | +</html> |
0 commit comments