Template:图书排版/doc:修订间差异
补充:辅助类速查后新增「辅助类演示」一节(实时渲染);修正 heti-list-han 为暂不可用(cjk-ideographic 不在白名单) |
以 heti 官方规则为底补齐版式类,并把版式改为模板参数开关({{图书排版|行间注}} 等) |
||
| (未显示2个用户的27个中间版本) | |||
| 第3行: | 第3行: | ||
== 用法 == |
== 用法 == |
||
在页面'''顶部'''引入模板、在正文'''结束处闭合容器'''(153 个既有页面均已如此): |
|||
在页面顶部引用: |
|||
<pre> |
<pre> |
||
<nowiki>{{ |
<nowiki>{{图书排版}}</nowiki> |
||
(正文……) |
|||
<nowiki>{{图书排版/尾}}</nowiki> |
|||
</pre> |
</pre> |
||
'''头部与尾部必须成对。''' 头部模板总是输出一个基础容器 <code><div class="tushu-body"></code>(不传参数时也一样,只是不带版式类),闭合靠 <code>{{tl|图书排版/尾}}</code> 或文末手写 <code></div></code>。 |
|||
* 漏写尾部'''不会报错''',但容器会自动延伸到页面末尾,把后续章节与页尾导航一并包进版式里。 |
|||
* 尾部应放在 <code>----</code> 与 <code><references /></code> '''之上''',使参考资料节留在容器内、页尾导航与分类留在容器外。 |
|||
样式'''只作用于正文段落与标题''': |
样式'''只作用于正文段落与标题''': |
||
* 段落 <code><p></code>:字号、行高 |
* 段落 <code><p></code>:字号、行高、首行缩进、两端对齐、断行规则 |
||
* 标题 <code><h1></code>–<code><h6></code>:字号阶梯、行高 |
* 标题 <code><h1></code>–<code><h6></code>:字号阶梯、行高、字重 |
||
* <code><ruby></code> / <code><rt></code>:行间注注音 |
|||
表格、列表、链接、引用、代码块、<code>mark</code>/<code>q</code>/<code>sup</code>/<code>sub</code> 等元素'''不受影响'''——导航框、目录表、信息框的版式不会被改动。 |
表格、列表、链接、引用、代码块、<code>mark</code>/<code>q</code>/<code>sup</code>/<code>sub</code> 等元素'''不受影响'''——导航框、目录表、信息框的版式不会被改动。 |
||
| 第17行: | 第26行: | ||
== 默认排版效果 == |
== 默认排版效果 == |
||
=== 字体分派:中文 / 西文 |
=== 字体分派:中文 / 西文 === |
||
正文字体栈按「西文 → 黑体 → 宋体 → 扩展区」的顺序回退: |
|||
样式用两个 <code>@font-face</code> 配 <code>unicode-range</code>,把不同码位分给不同字体: |
|||
{| class="wikitable" |
{| class="wikitable" |
||
! 字符范围 !! 实际字体 !! 说明 |
! 字符范围 !! 实际字体 !! 说明 |
||
|- |
|- |
||
| 拉丁字母、数字(ASCII) || |
| 拉丁字母、数字(ASCII) || Verdana / Arial(黑体栈的西文) || 保留原有西文观感 |
||
|- |
|- |
||
| 汉字、假名等 CJK || '''PingFang SC / Microsoft YaHei'''(黑体栈) → Hiragino Sans GB → SimSun → SimSun-ExtB/G → Jigmo → HanaMin || 黑体优先,屏幕阅读舒适;生僻字自动往后掉到扩展区字体。繁体视图由 <code>:lang(zh-hant)</code> 换成繁体系(苹方 TC / 微軟正黑體) |
|||
| 汉字、假名等 CJK || '''Noto Serif SC''' → Source Han Serif SC → Songti SC → SimSun → PingFang SC Regular → … || 宋体类优先(思源宋体 → macOS 宋体 → Windows 宋体),苹方、雅黑等黑体仅作最后兜底;可用名称因系统而异 —— '''Windows 上安装的苹方其注册名为 <code>PingFang SC Regular</code>''',写成家族名 <code>PingFang SC</code> 或 macOS 的 <code>PingFangSC-Regular</code> 都不会匹配。(<code>local()</code> 只认字体全名 / PostScript 名) |
|||
|- |
|- |
||
| 标点(<code>,。、:;!?()“”《》「」</code>) || 跟随正文字体(上两行同源) || 2026-09 起不再单独指定字体;引号字形随各字体而异 |
|||
| 中文标点(引号、破折号、顿号、书名号等) || Noto Serif SC → Source Han Serif SC → Songti SC → SimSun(宋体类) || 标点占满一个全角字身,两侧留白正常 |
|||
|} |
|} |
||
'''为什么标点要单独处理:'''全角引号 <code>“ ”</code> 的码位是 U+201C / U+201D,Georgia、苹方、微软雅黑都含这两个字形,且做成'''西文风格的窄引号'''——此前因此出现「引号与后一个字贴在一起」。现在标点固定交给宋体类全角字体,任何设备上都不会再贴字。 |
|||
=== 字号阶梯 === |
=== 字号阶梯 === |
||
| 第36行: | 第43行: | ||
! 元素 !! 字号 !! 行高 |
! 元素 !! 字号 !! 行高 |
||
|- |
|- |
||
| <code><h1></code> || |
| <code><h1></code> || <code>2.25rem</code>(36px) || <code>1.4</code> |
||
|- |
|- |
||
| <code><h2></code> || |
| <code><h2></code> || <code>1.875rem</code>(30px) || <code>1.4</code> |
||
|- |
|- |
||
| <code><h3></code> || |
| <code><h3></code> || <code>1.625rem</code>(26px) || <code>1.4</code> |
||
|- |
|- |
||
| <code><h4></code> || |
| <code><h4></code> || <code>1.5rem</code>(24px) || <code>1.4</code> |
||
|- |
|- |
||
| <code><h5></code> || |
| <code><h5></code> || <code>1.375rem</code>(22px) || <code>1.4</code> |
||
|- |
|- |
||
| <code><h6></code> || |
| <code><h6></code> || <code>1.25rem</code>(20px) || <code>1.4</code> |
||
|- |
|- |
||
| 正文 <code><p></code> || |
| 正文 <code><p></code> || <code>1.25rem</code>(20px) || <code>2</code> |
||
|} |
|} |
||
'''单位策略''':'''正文与标题用 <code>rem</code>'''——相对根字号(<code>html { font-size: 100% }</code> = 16px),嵌套时不会叠乘,与 MediaWiki 的 <code>--font-size-medium</code> 做法一致;'''辅助类字号用 <code>em</code>'''——相对所在元素的字号,随环境自动缩放。 |
|||
=== 段落与对齐 === |
=== 段落与对齐 === |
||
* 字 |
* 字号 <code>1.25rem</code>(= 20px) |
||
* 段距:不自行声明,用站点默认(<code>.mw-body p</code> 为 <code>0.5em</code> 上 / <code>1em</code> 下) |
|||
* 首行缩进 <code>2em</code> |
* 首行缩进 <code>2em</code> |
||
* 两端对齐 <code>text-align: justify</code> |
* 两端对齐 <code>text-align: justify</code> |
||
* 行高 |
* 行高 <code>2</code>;标题行高 <code>1.4</code> |
||
* 非中文段落自动左对齐、取消缩进 |
* 非中文段落自动左对齐、取消缩进 |
||
* 长串西文自动断行(<code>overflow-wrap</code> / <code>hyphens</code>) |
* 长串西文自动断行(<code>overflow-wrap</code> / <code>hyphens</code>) |
||
| 第66行: | 第76行: | ||
岁乙未,吾邑疫疠大作,予家臧获率六七就枕席。予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。”Latin check: Georgia ABC abc 0123 — “quoted latin”。 |
岁乙未,吾邑疫疠大作,予家臧获率六七就枕席。予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。”Latin check: Georgia ABC abc 0123 — “quoted latin”。 |
||
== 可选版式( |
== 可选版式(模板参数) == |
||
下列版式默认不生效 |
下列版式默认不生效;给模板传参数即可打开对应容器(英文别名等效)。 |
||
参数可以'''叠加'''——多写几个,类名会拼在同一个容器上,两种版式同时生效:<code><nowiki>{{图书排版|诗词|限宽}}</nowiki></code> → <code><div class="heti--poetry heti--line-length"></code>。 |
|||
=== 古籍体 <code>heti--ancient</code> === |
|||
标题居中、正文宋体,适合序跋。 |
|||
<pre> |
|||
<div class="heti heti--ancient"> |
|||
(正文) |
|||
</div> |
|||
</pre> |
|||
<div class="heti heti--ancient"> |
|||
'''刻《仲景全书》序''' |
|||
予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。” |
|||
</div> |
|||
{| class="wikitable" |
|||
=== 诗词体 <code>heti--poetry</code> === |
|||
! 参数 !! 英文别名 !! 容器类 !! 效果 |
|||
|- |
|||
| <code>诗词</code> || <code>poetry</code> || <code>heti--poetry</code> || 居中、不缩进 |
|||
|- |
|||
| <code>限宽</code> || <code>line-length</code> || <code>heti--line-length</code> || 正文限宽 42em 并居中 |
|||
|- |
|||
| <code>双栏</code> || <code>columns-2</code> || <code>heti--columns-2</code> || 两栏(栏目数固定为 2) |
|||
|} |
|||
=== 诗词体(参数 <code>诗词</code>) === |
|||
正文居中、不缩进,适合诗词、铭文。 |
正文居中、不缩进,适合诗词、铭文。 |
||
<pre> |
<pre> |
||
<nowiki>{{图书排版|诗词}}</nowiki> |
|||
<div class="heti heti--poetry"> |
|||
<p>床前明月光,疑是地上霜。</p> |
|||
(诗句,每句之间空一行) |
|||
</div> |
|||
<nowiki>{{图书排版/尾}}</nowiki> |
|||
</pre> |
</pre> |
||
{{图书排版|诗词}} |
|||
<div class="heti heti--poetry"> |
|||
'''静夜思''' |
'''静夜思''' |
||
<p>床前明月光,疑是地上霜。</p> |
<p>床前明月光,疑是地上霜。</p> |
||
<p>举头望明月,低头思故乡。</p> |
<p>举头望明月,低头思故乡。</p> |
||
{{图书排版/尾}} |
|||
</div> |
|||
=== |
=== 分栏诗词(推荐配 <code><poem></code>) === |
||
Poem 扩展的 <code><poem></code> 负责把换行变成 <code><br></code>(因此诗句'''不必每句空行'''),<code>|双栏</code> 负责分栏并把诗句改为左对齐(<code>|诗词|双栏</code> 组合与参数顺序无关)。诗词名与作者放在分栏容器'''之外''',只有诗块参与分栏。 |
|||
自上而下、右起排列,适合牌记、题签。 |
|||
<pre> |
|||
<div class="heti heti--vertical"> |
|||
<p>岁乙未,吾邑疫疠大作。</p> |
|||
</div> |
|||
</pre> |
|||
<div class="heti heti--vertical"> |
|||
<p>岁乙未,吾邑疫疠大作,予家臧获率六七就枕席。</p> |
|||
</div> |
|||
=== 行间注 <code>heti--annotation</code> === |
|||
行距放大到 2.25,便于行间标注;<code><em></code> 自动变成着重号(字下点)。 |
|||
<pre> |
<pre> |
||
<nowiki>{{图书排版|诗词|双栏}}</nowiki> |
|||
<div class="heti heti--annotation"> |
|||
<p>…正文<em>需着重的字</em>…</p> |
|||
</div> |
|||
</pre> |
|||
<div class="heti heti--annotation"> |
|||
<p>予读而知其为<em>成无己</em>所解之书也。然而鱼亥不可正,句读不可离矣。</p> |
|||
</div> |
|||
==静夜思== |
|||
=== 多栏 <code>heti--columns-2</code> / <code>heti--columns-3</code> === |
|||
把正文排成多栏;也可用 <code>heti--columns-16em</code> 到 <code>heti--columns-48em</code> 指定栏宽。 |
|||
<pre> |
|||
<div class="heti heti--columns-2"> |
|||
<p>(较长的正文)</p> |
|||
</div> |
|||
</pre> |
|||
<div class="heti heti--columns-2"> |
|||
<p>予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。”吾吴和缓明卿沈君南昉在海虞,藉其力而起死亡殆徧,予家得大造于沈君矣。不知沈君操何术而若斯之神,因询之。</p> |
|||
</div> |
|||
——唐·李白 |
|||
=== 字体族切换 === |
|||
{| class="wikitable" |
|||
! class !! 中文字体 |
|||
|- |
|||
| <code>heti--hei</code>(默认) || 黑体(PingFang SC / Microsoft YaHei UI) |
|||
|- |
|||
| <code>heti--song</code> / <code>heti--serif</code> / <code>heti--classic</code> || 宋体(Songti SC / SimSun) |
|||
|- |
|||
| <code>heti--kai</code> || 楷体(Kaiti SC / STKaiti / KaiTi) |
|||
|} |
|||
<div class="heti heti--song"> |
|||
<p>宋体示例:予曰:“吾闻是书于家大夫之日久矣。”</p> |
|||
</div> |
|||
<div class="heti heti--kai"> |
|||
<p>楷体示例:予曰:“吾闻是书于家大夫之日久矣。”</p> |
|||
</div> |
|||
<nowiki><poem></nowiki> |
|||
=== 辅助类速查 === |
|||
床前明月光 |
|||
{| class="wikitable" |
|||
疑是地上霜 |
|||
! class !! 用途 |
|||
举头望明月 |
|||
|- |
|||
低头思故乡 |
|||
| <code>heti-meta</code> || 落款、副题(块级、不缩进) |
|||
<nowiki></poem></nowiki> |
|||
|- |
|||
| <code>heti-verse</code> || 诗句(居中、不缩进) |
|||
|- |
|||
| <code>heti-large</code> / <code>heti-x-large</code> / <code>heti-small</code> / <code>heti-x-small</code> || 字号微调 18px / 20px / 14px / 12px |
|||
|- |
|||
| <code>heti-fn</code> || 文末注释区 |
|||
|- |
|||
| <code>heti-hang</code> || 悬挂缩进 |
|||
|- |
|||
| <code>heti-em</code> || 着重号(字下点) |
|||
|- |
|||
| <code>heti-ruby--inline</code> || 行内 ruby 紧凑排版 |
|||
|- |
|||
| <code>heti-list-latin</code> || 列表编号:大写拉丁字母(内层罗马数字、再内层小写字母) |
|||
|- |
|||
| <code>heti-list-han</code> || '''暂不可用''':汉字编号(<code>cjk-ideographic</code>)不在 TemplateStyles 白名单内,规则已被剔除,仅剩 <code>ol</code> 的数字回退 |
|||
|} |
|||
=== 辅助类演示 === |
|||
下面每个类的效果都是本页实时渲染的。 |
|||
<nowiki>{{图书排版/尾}}</nowiki> |
|||
'''heti-meta'''(落款、副题:块级、不缩进) |
|||
<pre> |
|||
<div class="heti-meta">万历己亥三月谷旦 海虞清常道人赵开美序</div> |
|||
</pre> |
</pre> |
||
<div class="heti-meta">万历己亥三月谷旦 海虞清常道人赵开美序</div> |
|||
该组合也可手写为 <code><div class="heti--poetry heti--columns-2"></code>(与 <code>|诗词|双栏</code> 等价,参数顺序无关)。 |
|||
'''heti-verse'''(诗句:居中、不缩进) |
|||
注意 <code>|双栏</code> 自带 <code>max-width: none</code>(多栏需要宽度),'''不要再叠加 <code>|限宽</code>'''。 |
|||
<pre> |
|||
<div class="heti-verse">床前明月光,疑是地上霜。</div> |
|||
</pre> |
|||
<div class="heti-verse">床前明月光,疑是地上霜。</div> |
|||
用法(尾部可选,见[[#容器与闭合]]): |
|||
'''heti-large / heti-x-large / heti-small / heti-x-small'''(四档字号) |
|||
<pre> |
<pre> |
||
<nowiki>{{图书排版|诗词}}</nowiki> |
|||
<div class="heti-large">……</div> |
|||
(正文) |
|||
<nowiki>{{图书排版/尾}}</nowiki> |
|||
</pre> |
</pre> |
||
下方各节仍可用手写 class 的方式实现同样效果。 |
|||
<div class="heti-large">heti-large(18px):予曰:“吾闻是书于家大夫之日久矣。”</div> |
|||
<div class="heti-x-large">heti-x-large(20px):予曰:“吾闻是书于家大夫之日久矣。”</div> |
|||
<div class="heti-small">heti-small(14px):予曰:“吾闻是书于家大夫之日久矣。”</div> |
|||
<div class="heti-x-small">heti-x-small(12px):予曰:“吾闻是书于家大夫之日久矣。”</div> |
|||
=== 多栏(参数 <code>双栏</code>) === |
|||
'''heti-fn'''(文末注释区) |
|||
把正文排成两栏。注意'''不要叠加 <code>|限宽</code>'''——多栏自带 <code>max-width: none</code>(分栏需要宽度),限宽 42em 再分两栏每栏只剩约 350px。 |
|||
<pre> |
<pre> |
||
<nowiki>{{图书排版|双栏}}</nowiki> |
|||
<div class="heti-fn"> |
|||
<ol> |
|||
<li>……</li> |
|||
</ol> |
|||
</div> |
|||
</pre> |
|||
<div class="heti-fn"> |
|||
<ol> |
|||
<li>赵开美,字清常,海虞(今江苏常熟)人,明代刻书家。</li> |
|||
<li>所刻《仲景全书》为《伤寒论》传世重要版本之一。</li> |
|||
</ol> |
|||
</div> |
|||
(较长的正文) |
|||
'''heti-em'''(着重号:字下点) |
|||
<pre> |
|||
<span class="heti-em">成无己</span> |
|||
</pre> |
|||
<p>予读而知其为<span class="heti-em">成无己</span>所解之书也。</p> |
|||
<nowiki>{{图书排版/尾}}</nowiki> |
|||
'''heti-ruby--inline'''(行内 ruby 紧凑排版) |
|||
<pre> |
|||
<span class="heti-ruby--inline"><ruby>疫<rt>yì</rt></ruby></span> |
|||
</pre> |
</pre> |
||
{{图书排版|双栏}} |
|||
<p>吾邑<span class="heti-ruby--inline"><ruby>疫<rt>yì</rt></ruby></span>疠大作。</p> |
|||
<p>予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。”吾吴和缓明卿沈君南昉在海虞,藉其力而起死亡殆徧,予家得大造于沈君矣。不知沈君操何术而若斯之神,因询之。</p> |
|||
{{图书排版/尾}} |
|||
=== 字体族切换 === |
|||
'''heti-list-latin'''(列表编号:拉丁字母) |
|||
{| class="wikitable" |
|||
<pre> |
|||
! class !! 中文字体 |
|||
<div class="heti-list-latin"> |
|||
|- |
|||
<ol> |
|||
| <code>heti--song</code> / <code>heti--serif</code> || 宋体(Songti SC / SimSun) |
|||
<li>……</li> |
|||
|} |
|||
</ol> |
|||
字体族类是这套样式里'''没有模板参数入口'''的,需要时这样手写。注意'''只写这一个类名''',不要写成 <code>class="heti heti--song"</code>——本站'''没有引入''' heti 的 <code>.heti</code> 容器类。 |
|||
</div> |
|||
<div class="heti--song"> |
|||
</pre> |
|||
<p>宋体示例:予曰:“吾闻是书于家大夫之日久矣。”</p> |
|||
<div class="heti-list-latin"> |
|||
<ol> |
|||
<li>太阳病</li> |
|||
<li>阳明病</li> |
|||
<li>少阳病</li> |
|||
</ol> |
|||
</div> |
</div> |
||
== 作用范围与限制 == |
|||
'''heti-hang'''(悬挂:用于标题内落款。此类为 <code>position:absolute</code> 且未设偏移量,单独使用没有视觉变化,需按具体版式配合定位属性) |
|||
* 只影响 <code>p</code>、<code>h1</code>–<code>h6</code> 与各版式容器;其余标签一律不碰。 |
|||
<pre> |
|||
* 段落规则会命中'''模板输出里的 p'''(少数模板会生成段落),影响很小但存在。 |
|||
<h2>刻《仲景全书》序<span class="heti-hang">赵开美</span></h2> |
|||
* 纸色背景 <code>#f6f4f0</code> 需要选中内容容器自身,TemplateStyles 无法做到,需站点级 CSS。 |
|||
</pre> |
|||
* 未引入 heti 的 JavaScript 增强(中西文自动间距、标点挤压):需要改站点 JS,且其挤压方向与「标点要有留白」相反。 |
|||
== 容器与闭合 == |
|||
<code><nowiki>{{图书排版}}</nowiki></code> 会输出一个基础容器 <code><div class="tushu-body"></code>,正文限宽(42em + 居中)就挂在这个容器上——容器继承正文字号,因此 <code>em</code> 的基准就是正文,标题与段落因而同宽对齐。(若把 <code>max-width</code> 分别写在 <code>p</code> 与 <code>h1</code>–<code>h6</code> 上,<code>em</code> 会按各元素自身字号计算,h1 的 42em 宽达 1344px,标题反而无法与正文对齐。) |
|||
'''写上 <code><nowiki>{{图书排版/尾}}</nowiki></code> 显式闭合'''(等价于手写 <code></div></code>)。153 个既有页面均已如此。 |
|||
== 行间注(注音 / 训诂) == |
|||
styles.css 自 2026-09 起支持 '''HTML ruby 行间注''',注文显示在字上方小字,无需任何扩展,在 wikitext 里直接写: |
|||
<pre> |
|||
<ruby>被注字<rt>pīn yīn</rt></ruby> |
|||
</pre> |
|||
上方注文默认 0.55em 小字;若整段都要注音,建议配合上面的行间注版式(行距 2.25)使用。 |
|||
'''尾部应放在 <code>----</code> 与 <code><references /></code> 之上''',这样参考资料节留在容器内,而页尾导航、目录、分类留在容器外。若两者都不存在,则放在 <code><nowiki>{{daohang-f}}</nowiki></code> 之上。 |
|||
示例:注音与行间注渲染效果如下 |
|||
若不写尾部,容器会由 HTML5 解析器自动闭合到内容区末尾:页面不会报错,但页末的导航、目录也会被一并限宽。 |
|||
<div class="heti heti--annotation"> |
|||
* 传了版式参数也一样:容器始终只有一个,参数是它的附加类,例如 <code>class="tushu-body heti--poetry"</code>。 |
|||
吾邑<ruby>疫<rt>yì</rt></ruby>疠大作,予家<ruby>臧<rt>zāng</rt></ruby>获<ruby>率<rt>shuài</rt></ruby>六七就枕席。 |
|||
* 本版式仅用于'''页面正文内容''';本站阅读器(Gadget BookVerticalReader)是独立的书籍阅读器,与本模板的版式开关无关。 |
|||
</div> |
|||
* 版式类名沿用 heti([https://github.com/sivan/heti sivan/heti])的官方命名;本站样式表以 heti 官方规则为底、按需补齐,全部内容都在 [[Template:图书排版/styles.css]] 内,'''不加载任何外部 heti 文件'''。 |
|||
== 作用范围与限制 == |
|||
* 只影响 <code>p</code>、<code>h1</code>–<code>h6</code>、<code>ruby</code>;其余标签一律不碰。 |
|||
* 段落规则会命中'''模板输出里的 p'''(少数模板会生成段落),影响很小但存在。 |
|||
* 纸色背景 <code>#f6f4f0</code> 需要选中内容容器自身,TemplateStyles 无法做到,需站点级 CSS。 |
|||
* 未引入 heti 的 JavaScript 增强(中西文自动间距、标点挤压):需要改站点 JS,且其挤压方向与「标点要有留白」相反。 |
|||
== 繁体(zh-Hant)的字体 == |
|||
== 注意事项 == |
|||
简体视图正文用黑体栈(苹方 SC → 微软雅黑 → …);繁体视图由 <code>:lang(zh-hant)</code> 规则改用繁体系字体栈(苹方 TC → '''微軟正黑體''' → 思源黑體 TC → 明體 → …),与站内 Vector 皮肤一致。两套栈只在中文段不同:西文、标点(<code>@font-face</code>)与扩展区兜底(<code>SimSun-ExtB</code>/<code>SimSun-ExtG</code>/<code>Jigmo</code>/<code>HanaMin</code>)相同。 |
|||
* 一个 <code><ruby></code> 只注一音,要注多义请按需拆开显示。 |
|||
* 行间注版式仅用于'''页面正文内容''';本站阅读器(Gadget BookVerticalReader)是独立的书籍阅读器,与本模板的行间注功能无关。 |
|||
* 可选版式的 class 名沿用 <code>heti--*</code> 命名(来自中文排版方案 heti),但本站'''不依赖任何 heti 文件''',全部样式都在 [[Template:图书排版/styles.css]] 内。 |
|||
== 参见 == |
== 参见 == |
||
2026年9月22日 (二) 21:16的最新版本
该模板用于书籍内容页(如“伤寒论/章节”页面)的正文排版,本身不输出任何可见内容,只通过 TemplateStyles 引入 Template:图书排版/styles.css。
用法
在页面顶部引入模板、在正文结束处闭合容器(153 个既有页面均已如此):
{{图书排版}}
(正文……)
{{图书排版/尾}}
头部与尾部必须成对。 头部模板总是输出一个基础容器 <div class="tushu-body">(不传参数时也一样,只是不带版式类),闭合靠 {{图书排版/尾}} 或文末手写 </div>。
- 漏写尾部不会报错,但容器会自动延伸到页面末尾,把后续章节与页尾导航一并包进版式里。
- 尾部应放在
----与<references />之上,使参考资料节留在容器内、页尾导航与分类留在容器外。
样式只作用于正文段落与标题:
- 段落
<p>:字号、行高、首行缩进、两端对齐、断行规则 - 标题
<h1>–<h6>:字号阶梯、行高、字重
表格、列表、链接、引用、代码块、mark/q/sup/sub 等元素不受影响——导航框、目录表、信息框的版式不会被改动。
默认排版效果
字体分派:中文 / 西文
正文字体栈按“西文 → 黑体 → 宋体 → 扩展区”的顺序回退:
| 字符范围 | 实际字体 | 说明 |
|---|---|---|
| 拉丁字母、数字(ASCII) | Verdana / Arial(黑体栈的西文) | 保留原有西文观感 |
| 汉字、假名等 CJK | PingFang SC / Microsoft YaHei(黑体栈) → Hiragino Sans GB → SimSun → SimSun-ExtB/G → Jigmo → HanaMin | 黑体优先,屏幕阅读舒适;生僻字自动往后掉到扩展区字体。繁体视图由 :lang(zh-hant) 换成繁体系(苹方 TC / 微软正黑体)
|
标点(,。、:;!?()“”《》「」) |
跟随正文字体(上两行同源) | 2026-09 起不再单独指定字体;引号字形随各字体而异 |
字号阶梯
| 元素 | 字号 | 行高 |
|---|---|---|
<h1> |
2.25rem(36px) |
1.4
|
<h2> |
1.875rem(30px) |
1.4
|
<h3> |
1.625rem(26px) |
1.4
|
<h4> |
1.5rem(24px) |
1.4
|
<h5> |
1.375rem(22px) |
1.4
|
<h6> |
1.25rem(20px) |
1.4
|
正文 <p> |
1.25rem(20px) |
2
|
单位策略:正文与标题用 rem——相对根字号(html { font-size: 100% } = 16px),嵌套时不会叠乘,与 MediaWiki 的 --font-size-medium 做法一致;辅助类字号用 em——相对所在元素的字号,随环境自动缩放。
段落与对齐
- 字号
1.25rem(= 20px) - 段距:不自行声明,用站点默认(
.mw-body p为0.5em上 /1em下) - 首行缩进
2em - 两端对齐
text-align: justify - 行高
2;标题行高1.4 - 非中文段落自动左对齐、取消缩进
- 长串西文自动断行(
overflow-wrap/hyphens) - 相邻标题自动收紧间距(
h1+h2、h2+h3… 上边距 12px)
实时效果(本页即为演示):
刻《仲景全书》序
岁乙未,吾邑疫疠大作,予家臧获率六七就枕席。予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。”Latin check: Georgia ABC abc 0123 — “quoted latin”。
可选版式(模板参数)
下列版式默认不生效;给模板传参数即可打开对应容器(英文别名等效)。
参数可以叠加——多写几个,类名会拼在同一个容器上,两种版式同时生效:{{图书排版|诗词|限宽}} → <div class="heti--poetry heti--line-length">。
| 参数 | 英文别名 | 容器类 | 效果 |
|---|---|---|---|
诗词 |
poetry |
heti--poetry |
居中、不缩进 |
限宽 |
line-length |
heti--line-length |
正文限宽 42em 并居中 |
双栏 |
columns-2 |
heti--columns-2 |
两栏(栏目数固定为 2) |
诗词体(参数 诗词)
正文居中、不缩进,适合诗词、铭文。
{{图书排版|诗词}}
(诗句,每句之间空一行)
{{图书排版/尾}}
静夜思
床前明月光,疑是地上霜。
举头望明月,低头思故乡。
分栏诗词(推荐配 <poem>)
Poem 扩展的 <poem> 负责把换行变成 <br>(因此诗句不必每句空行),|双栏 负责分栏并把诗句改为左对齐(|诗词|双栏 组合与参数顺序无关)。诗词名与作者放在分栏容器之外,只有诗块参与分栏。
{{图书排版|诗词|双栏}}
==静夜思==
——唐·李白
<poem>
床前明月光
疑是地上霜
举头望明月
低头思故乡
</poem>
{{图书排版/尾}}
该组合也可手写为 <div class="heti--poetry heti--columns-2">(与 |诗词|双栏 等价,参数顺序无关)。
注意 |双栏 自带 max-width: none(多栏需要宽度),不要再叠加 |限宽。
用法(尾部可选,见#容器与闭合):
{{图书排版|诗词}}
(正文)
{{图书排版/尾}}
下方各节仍可用手写 class 的方式实现同样效果。
多栏(参数 双栏)
把正文排成两栏。注意不要叠加 |限宽——多栏自带 max-width: none(分栏需要宽度),限宽 42em 再分两栏每栏只剩约 350px。
{{图书排版|双栏}}
(较长的正文)
{{图书排版/尾}}
予曰:“吾闻是书于家大夫之日久矣,而书肆间绝不可得。”君曰:“予诚有之。”吾吴和缓明卿沈君南昉在海虞,藉其力而起死亡殆遍,予家得大造于沈君矣。不知沈君操何术而若斯之神,因询之。
字体族切换
| class | 中文字体 |
|---|---|
heti--song / heti--serif |
宋体(Songti SC / SimSun) |
字体族类是这套样式里没有模板参数入口的,需要时这样手写。注意只写这一个类名,不要写成 class="heti heti--song"——本站没有引入 heti 的 .heti 容器类。
宋体示例:予曰:“吾闻是书于家大夫之日久矣。”
作用范围与限制
- 只影响
p、h1–h6与各版式容器;其余标签一律不碰。 - 段落规则会命中模板输出里的 p(少数模板会生成段落),影响很小但存在。
- 纸色背景
#f6f4f0需要选中内容容器自身,TemplateStyles 无法做到,需站点级 CSS。 - 未引入 heti 的 JavaScript 增强(中西文自动间距、标点挤压):需要改站点 JS,且其挤压方向与“标点要有留白”相反。
容器与闭合
{{图书排版}} 会输出一个基础容器 <div class="tushu-body">,正文限宽(42em + 居中)就挂在这个容器上——容器继承正文字号,因此 em 的基准就是正文,标题与段落因而同宽对齐。(若把 max-width 分别写在 p 与 h1–h6 上,em 会按各元素自身字号计算,h1 的 42em 宽达 1344px,标题反而无法与正文对齐。)
写上 {{图书排版/尾}} 显式闭合(等价于手写 </div>)。153 个既有页面均已如此。
尾部应放在 ---- 与 <references /> 之上,这样参考资料节留在容器内,而页尾导航、目录、分类留在容器外。若两者都不存在,则放在 {{daohang-f}} 之上。
若不写尾部,容器会由 HTML5 解析器自动闭合到内容区末尾:页面不会报错,但页末的导航、目录也会被一并限宽。
- 传了版式参数也一样:容器始终只有一个,参数是它的附加类,例如
class="tushu-body heti--poetry"。 - 本版式仅用于页面正文内容;本站阅读器(Gadget BookVerticalReader)是独立的书籍阅读器,与本模板的版式开关无关。
- 版式类名沿用 heti(sivan/heti)的官方命名;本站样式表以 heti 官方规则为底、按需补齐,全部内容都在 Template:图书排版/styles.css 内,不加载任何外部 heti 文件。
繁体(zh-Hant)的字体
简体视图正文用黑体栈(苹方 SC → 微软雅黑 → …);繁体视图由 :lang(zh-hant) 规则改用繁体系字体栈(苹方 TC → 微软正黑体 → 思源黑体 TC → 明体 → …),与站内 Vector 皮肤一致。两套栈只在中文段不同:西文、标点(@font-face)与扩展区兜底(SimSun-ExtB/SimSun-ExtG/Jigmo/HanaMin)相同。