根据 《Adobe 2020年的技术传播行业趋势调查》， PDF 格式在内容发布的的格式选择排名最靠前，紧随其后的是 HTML5 格式。 受到诸多客户的需求鼓舞，本文揭示了如何应用 CSS 技术装扮您的 PDF 和 HTML 格式文档。
工作准备
- Oxygen XML Author/Editor 23.1
- DITA 源文件 和 DITA Map
实施步骤
- 新建 CSS 代码，如下示意：
/*
* ==============================================
* Skin for oXygen generated WebHelp.
* ==============================================
*/
/*
* ------------------------------------------------------------------
*
* Fonts.
*
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
html, body {
min-width:100%;
}
body{
font-family: "Noto Sans SC";
}
2. 命名 CSS 为 oxygen-font.CSS 后将 CSS 引入发布流程，方法如下：
在 Oxygen 编辑器 Editor 或 Author 引入 OPT 配置文件 ，具体内容如下
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<publishing-template>
<name>SampleCustomer</name>
<description>demo</description>
<webhelp>
<preview-image file="logo.png"/>
<parameters>
<parameter name="webhelp.show.main.page.tiles" value="no"/>
<parameter name="webhelp.show.main.page.toc" value="yes"/>
<parameter name="webhelp.top.menu.depth" value="3"/>
<parameter name="args.figurelink.style" value="TITLE"/>
<parameter name="args.tablelink.style" value="TITLE"/>
<parameter name="force-unique" value="true"/>
</parameters>
<resources>
<css file="oxygen-font.css"/>
<css file="notes.css"/>
<fileset>
<include name="resources/**/*"/>
<exclude name="resources/**/*.svn"/>
<exclude name="resources/**/*.git"/>
</fileset>
</resources>
<online-preview-url>https://www.oxygenxml.com/samples/DITA-WebHelp-Responsive/tree/oxygen-red/</online-preview-url>
<tags>
<tag type="layout">tree</tag>
<tag type="color">red</tag>
<tag type="color">light</tag>
</tags>
</webhelp>
</publishing-template>
3. 分别在 Oxygen 编辑器选中上述配置文件后发布 HTML 和 PDF 格式文档
4. 验证字体实施效果，如下图示意：
如果您对 Oxygen 环境下如何用 CSS 技术装扮您的公司产品手册，业务文档，如 QMS 质量管理体系文档 ， SOP 标准操作指南感兴趣，请联系我们。