ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

从 HTMLBook 到 PDF 与 Mobi:官方三套 CSS 样式表的应用全攻略

从 HTMLBook 到 PDF 与 Mobi:官方三套 CSS 样式表的应用全攻略 从 HTMLBook 到 PDF 与 Mobi官方三套 CSS 样式表的应用全攻略【免费下载链接】HTMLBookLets write books in HTML!项目地址: https://gitcode.com/gh_mirrors/ht/HTMLBookHTMLBook 是一个开源的、基于 XHTML5 的电子书写作与出版标准项目口号是Lets write books in HTML!。它允许你只维护一份 HTML 源文件借助官方自带的 CSS 样式表与 XSLT 转换脚本就能同时产出 EPUB、MobiKindle与 PDF 三种主流格式。本文为你梳理官方三套 CSS 样式表的职责分工、核心排版要点与接入 XSLT 流水线的完整方法让新手也能快速上手。一、HTMLBook 是什么一次编写多渠道出版HTMLBook 的核心理念有三个书籍是永恒的、HTML 是未来可预见的标记语言、单一来源的多格式输出永远有价值。因此 HTMLBook 被设计为XHTML5 的子集所有 HTMLBook 都是 XHTML5但并非所有 XHTML5 都是 HTMLBook语义化图书结构通过data-type属性表达chapter、part、appendix、titlepage等图书语义例如section[data-typechapter]可用 XML Schema 校验主 Schema 文件是 schema/htmlbook.xsd配合xmllint即可在命令行完成校验。而样式层面HTMLBook 官方直接采用CSS 编写样式表这正是本文的主角——stylesheets/目录下的三套官方样式表。二、官方三套 CSS 样式表速览epub、mobi、pdf 各司其职项目在 stylesheets/ 目录下按输出格式拆分为三个子目录样式表路径行数面向场景EPUBstylesheets/epub/epub.css约 520 行通用电子书阅读器Mobistylesheets/mobi/mobi.css约 565 行Amazon Kindle 设备PDFstylesheets/pdf/pdf.css约 167 行分页排版配合 PrinceXML / AntennaHouse三者的定位差异很大EPUB 与 Mobi 样式表聚焦「流式排版」处理段落缩进、扉页分页、目录样式而 PDF 样式表则聚焦「分页排版」处理page规则、页码计数器与页眉页脚。下面逐一讲解。三、EPUB 样式表应用epub.css 排版要点epub.css 是 EPUB 阅读器的首选样式几个值得注意的设计不内嵌字体样式表头部明确注释「不包含任何font-face处理」完全依赖阅读设备自带的 serif 与 sans-serif 系统字体避免字体文件撑大 EPUB 体积正文段落风格p, dd统一设置text-indent: 20px的首行缩进同时通过h1 p选择器让「标题后的首段不缩进」符合传统书籍排版习惯前置页面分页section[data-typetitlepage]、copyright-page、dedication均设置page-break-after: always保证每个前置页独立成页目录嵌套列表目录被设计为nav[data-typetoc]内的一系列嵌套li并通过list-style-type: none去掉列表符号。如果你的书以段落文本为主、希望阅读器端有更好的兼容性直接用这套官方样式即可。四、Mobi 样式表应用为 Kindle 优化stylesheets/mobi/mobi.css 与 EPUB 版共享大量基础规则正文缩进、前置页分页、目录样式但它针对 Kindle 设备的渲染特性做了更多补充总行数也更多。典型差异包括针对 Kindle 旧设备的 HTML 结构兼容处理例如将部分section降级为div以保证渲染稳定更细化的列表、引用与代码块样式适配 Kindle 较窄的屏幕宽度保留标题层级sect1–sect3的选择器写法确保各级标题在 Kindle 上层次清晰。实操建议转换 Mobi 时将 EPUB 生成的 XHTML 与mobi.css一起打包进 Kindle 转换工具如 KindleGen / Calibre即可获得更贴近纸质书的阅读体验。五、PDF 样式表应用pdf.css 的分页排版艺术pdf.css 是三套中结构最「硬核」的它面向的是分页排版工具如PrinceXML或AntennaHouse核心手法包括页面尺寸page { size: 7in 9in; margin: 0.75in 1in; }定义默认纸张规格命名页为titlepage、copyright、toc、foreword、preface、chapter、appendix、glossary、index等图书板块分别声明命名页例如section[data-typechapter] { page: chapter; page-break-before: always; }页码计数器利用page chapter:right { bottom-right-corner { content: counter(page) } }在右页右下角输出页码目录与前言使用小写罗马数字lower-roman正文细节body[data-typebook]开启hyphens: auto自动断词章节标题关闭断词图片max-width: 100%防止溢出页面。六、把样式表接入 XSLT 转换流水线样式表不会自动生效需要借助htmlbook-xsl目录下的 XSLT 脚本把它接进转换流程。理解这条链路很关键htmlbook.xsl是主模板导入common.xsl并包含 param.xsl、tocgen.xsl、indexgen.xsl、xrefgen.xsl负责目录、索引、交叉引用的自动生成param.xsl集中了全部参数其中css.filename参数会把指定的 CSS 以link形式嵌入输出 HTML 的head——这正是接入三套样式表的入口epub.xsl专用于生成 EPUB它导入 chunk.xsl 做分章拆分并包含 ncx.xsl 与 opf.xsl 生成 EPUB 的导航与元数据文件。最快的配置方法在调用 XSLT 时把css.filename指向stylesheets/epub/epub.css或stylesheets/pdf/pdf.css转换出的 HTML 即会自动引用对应样式表。七、快速上手用官方示例跑通全流程想最快看到效果可以直接使用项目自带的示例图书 samples/htmlbook.html。这份示例完整展示了从封面、扉页、版权页、献词、目录到章节、附录的完整图书结构是验证三套样式表的最佳素材。项目还附带 samples/markdown/open_government_sample.md 及其 HTML 版本可以对照学习从 Markdown 到 HTMLBook 的写作方式。示例中这张穿黄色雨衣的卡通企鹅插图位于 samples/images/rain_penguin.png正是用来测试图片在 EPUB、Mobi 与 PDF 三种输出中的排版效果——你可以用它快速验证img { max-width: 100% }等图片规则是否生效。八、常见问题与最佳实践Q1三套样式表可以混用吗不建议。EPUB 与 Mobi 属于流式排版PDF 属于分页排版混用会导致page规则在阅读器上失效。Q2想自定义样式怎么办最优雅的方式是复制官方 CSS 后做增量修改而不是直接改动官方文件——这样升级项目时不会丢失自定义样式。Q3PDF 输出需要什么工具pdf.css依赖支持 CSS Paged Media 的排版引擎官方注释中明确提到 AntennaHouse 与 PrinceXML普通浏览器直接打开无法获得分页效果。最佳实践总结源文件始终维护一份 HTMLBookEPUB 用 epub.cssKindle 用 mobi.css纸质印刷用 pdf.css 分页引擎用 schema/htmlbook.xsd 校验源文件用 param.xsl 的css.filename参数完成样式接入。掌握这套组合拳你的 HTML 书稿就能轻松走向所有主流阅读渠道。【免费下载链接】HTMLBookLets write books in HTML!项目地址: https://gitcode.com/gh_mirrors/ht/HTMLBook创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表