【Epub制作谈】首字上升与下沉的效果与实现
By Oxen（老老老牛），2013年11月30日夜
经常阅读西方书籍或翻译书籍的书友会留意到，常有一种每章第一段的首字有上升或下沉的特殊排版，看起来颇为新颖。老牛早年在广州图书馆外文阅览室阅读传播学著作时就常遇到这种版式。后来在用Word编排自己的文集时也常用这种首字下沉的版式，当然公文排版不好用这类首字处理方式。现在在电子书领域，我们在kinkdle或nook出版的电子书里也有大量的类似处理。
在电子书上首字上升和首字下沉是什么样的效果呢？看图：
首字上升：
首字下沉：
电子书的首字上升与下沉，老牛估且统称为首字风格吧，包括三种情况：
如何实现首字风格的排版效果呢？实现的方式很简单，我分两种实现方式来说明：
代码实现也有两种情况：
- 中文方式：段首为空两个全角空格；
- 西文方式：段首为首行缩进。
一、软件自动实现
这里用EpubSTAR自动实现首字风格版式。
- 点击“更多”按钮，选择“制作选项”选项卡；
- 将首字风格设置为“1-首字上升”或＂2-首字下沉”。如果不想要上升或下沉效果，则设置为“0-无”。
二、手工代码实现
1.中文方式
段首空两格，相信大家耳边还要回响小学语文老师的谆谆教诲吧。这是近代中国文化在西学东渐中吸收西方文化精华，增加中文书籍阅读性方面获得的进步。古文不用说区分段落，连标点符号都没。私塾先生只教句读，的书上加点而已。因此中国近代有学之士的标点引进和段落区分，对后世产生的积极影响不可估量。
回到同样是受益于西方文化的首字风格处理，我们要从两个方面着手实现：
一是内容文本。我们可在每章第一段的第一个字加上处理代码，用一个类“initialraise”（上升）或“initialsinking”（下沉）来实现。
这是首字上升的代码（这些代码都是EpubSTAR自动生成的，下同）：
[code]<h2>笨狼进城</h2>
<span class="initialraise">听</span>说城里很热闹，笨狼就想去看看。
他穿上红色的灯笼裤，戴上白色的鸭舌帽，唱首歌儿走出森林，来到了公路上。
[/code]
这是首字下沉的代码：
[code]<h2>笨狼进城</h2>
<span class="initialsinking">听</span>说城里很热闹，笨狼就想去看看。
他穿上红色的灯笼裤，戴上白色的鸭舌帽，唱首歌儿走出森林，来到了公路上。
[/code]
二是样式表。我们用p标签选择器和initialraise和initialsinking两个类选择器来实现。
- p标签：由于中文每段已经空了两个全角空格，必须将text-indent属性值设置为0em。
- initialraise类：由于是上升处理，必须将字号增大。这里老牛设置为正文字体的两倍，即font-size:2em。为了良好效果，也可设置字体颜色等。
- initialsinking类：由于是下沉处理，也应将字号增大。这里老牛设置为1.618em。同时，必须将float属性设置为left。另外，为了将首字置于适当位置，避免四周无谓的空间，可设置margin属性。为了良好效果，也可设置字体颜色等。
这是首字上升的样式表代码（老牛样式片断）：
[code]
p {
text-indent: 0em;
}
.initialraise {
color: gray;
font-size:2em;
font-weight:bold;
}
[/code]
这是首字下沉的样式表代码（老牛样式片断）：
[code]
p {
text-indent: 0em;
}
.initialsinking {
font-size:1.618em;
float:left;
margin:5px;
padding:3px;
text-indent: 0em!important;
}
[/code]
2.西文方式
西文段首一般采用缩进的方式来区分段落。实际上在机械打字时代区分段落有空若干空格和缩进两种方式，目前电子时代以缩进为多，这里老牛就只讨论缩过这种常用情况。在电子书制作时，如何处理首字风格呢？
同样从内容文本和样式表代码两个方面来实现：
一是内容文本。同样要在每章第一段的第一个字加上处理代码，用“initialraise”（上升）或“initialsinking”（下沉）两个类选择器来实现。
与中文段首空格不同的是，我们还要再加上一个专门的类选择器，来特别指明这是第一段，与其他段不一样。这个特指第一段的类选择器老牛估命名为"first"，意即第一段也。
这是首字上升的代码（这些代码都是EpubSTAR自动生成的，下同）：
[code]<h2>笨狼进城</h2>
<p class="first"><span class="initialraise">听</span>说城里很热闹，笨狼就想去看看。
他穿上红色的灯笼裤，戴上白色的鸭舌帽，唱首歌儿走出森林，来到了公路上。
[/code]
这是首字下沉的代码：
[code]<h2>笨狼进城</h2>
<p class="first"><span class="initialsinking ">听</span>说城里很热闹，笨狼就想去看看。
他穿上红色的灯笼裤，戴上白色的鸭舌帽，唱首歌儿走出森林，来到了公路上。
[/code]
二是样式表。用p标签选择器和initialraise和initialsinking以及新增的first三个类选择器来实现。
- p标签：西文缩进两格，即将text-indent属性值设置为2em。
- initialraise类：由于是上升处理，必须将字号增大。这里老牛设置为正文字体的两倍，即font-size:2em。为了良好效果，也可设置字体颜色等。
- initialsinking类：由于是下沉处理，也应将字号增大。这里老牛设置为1.618em。同时，必须将float属性设置为left。另外，为了将首字置于适当位置，避免四周无谓的空间，可设置margin属性。为了良好效果，也可设置字体颜色等。
- first类：这是特指每章的第一个段落，以区别于其他段落。老牛将first类的唯一属性text-indent属性值设置为0em。因为首字风格的所在第一段不能与其他段落一样缩进两格。如果不专设first类，第一段也将如其他段落一样缩进了两格。
这是首字上升的样式表代码（老牛样式片断）：
[code]
p {
text-indent: 2em;
}
p.first {
text-indent: 0em;
}
.initialraise {
color: gray;
font-size:2em;
font-weight:bold;
}
[/code]
这是首字下沉的样式表代码（老牛样式片断）：
[code]
p {
text-indent: 2em;
}
p.first {
text-indent: 0em;
}
.initialsinking {
font-size:1.618em;
float:left;
margin:5px;
padding:3px;
text-indent: 0em!important;
}
[/code]
综合来看，自动实现方式确实简单，不用像手工编代码那样费一吨脑细胞。
本课讲完了。祝各书友制作愉快。
