小小飞
1
分享一个自己在用的PDF导出CSS代码
新增功能：
- 手动分页功能，在正文里添加
<div class="page-break"></div> 实现手动分页
- 优化大标题显示，现在居中显示并匹配主题颜色
- 优化各级标题间距，字体大小
主要改动：
- 强制了所有标题为黑色，其他内容颜色保持原样
- 替换了callout样式并对齐内容
- 英文字体强制为Time new Roman，中文字体为宋体
- 行间距与段间距和标题间距采用国际标准
- 各级标题起始会智能分页
- 优化表格全宽显示
- 增加了页码显示
代码片段
@media print {
@page {
@bottom-center {
content: counter(page);
font-size: 12pt !important;
}
}
body {
/* 布局相关 */
margin: 2.5cm 1.5cm 1.5cm 2cm !important;
padding: 0 !important;
width: 100% !important;
max-width: 21cm !important;
margin: 0 auto !important; /* 确保居中 */
/* 字体和文本相关 */
font-family: "Times New Roman", "Times", serif !important;
line-height: 1.5 !important;
color: #000 !important;
background: #fff !important;
text-align: justify !important;
}
/* 语言样式 - 只覆盖字体，不覆盖布局 */
:lang(zh), :lang(zh-Hans), :lang(zh-Hant) {
font-family: "SimSun", "宋体", "Times New Roman", serif !important;
}
:lang(ja) {
font-family: "MS Mincho", "SimSun", "Times New Roman", serif !important;
}
:lang(ko) {
font-family: "Batang", "SimSun", "Times New Roman", serif !important;
}
/* 手动分页功能 在文档里添加 "<div class="page-break"></div>" 实现手动控制分页*/
.page-break, .manual-break, [data-break] {
page-break-before: always !important;
break-before: page !important;
display: block !important;
height: 0px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
font-size: 0 !important;
line-height: 0 !important;
}
/* 重置可能的冲突 */
body * {
page-break-inside: auto !important;
}
/* ========== 标题标准化 ========== */
h1 {
font-size: 20pt !important;
font-weight: bold !important;
margin-top: -9pt !important;
margin-bottom: 24pt !important;
page-break-after: avoid !important;
text-align: center !important;
}
/* 二级标题：节 (如：1.1) */
h2 {
font-size: 16pt !important; /* 比h1小，但比h3大 */
font-weight: bold !important;
color: #000 !important;
margin-top: 24pt !important;
margin-bottom: 15pt !important;
page-break-after: avoid !important;
/* border-bottom: 1pt solid #ddd !important; /* 可选：添加下划线 */
}
/* 三级标题：条 (如：1.1.1) */
h3 {
font-size: 14pt !important;
font-weight: 600 !important; /* 比bold稍细，以示区别 */
color: #000 !important;
margin-top: 18pt !important;
margin-bottom: 12pt !important;
page-break-after: avoid !important;
}
/* 四级标题：款 (如：1.1.1.1) */
h4 {
font-size: 13.5pt !important;
font-weight: bold !important;
color: #333 !important; /* 颜色稍浅，降低重要性 */
margin-top: 15pt !important; /* 上下间距更小 */
margin-bottom: 9pt !important;
margin-left: 1em !important; /* 可选项：增加左缩进，形成视觉层级 */
page-break-after: avoid !important;
}
/* 五级标题及以下 (如：(1) )，通常视为段落标题，可不入目录 */
h5, h6 {
font-size: 13pt !important;
font-weight: normal !important; /* 甚至可以不加粗 */
color: #333 !important;
margin-top: 6pt !important;
margin-bottom: 0pt !important;
display: inline !important; /* 使其与后续正文在同一行开始 */
}
/* 对于h5, h6，需要在其后紧跟一个段落时，可以这样处理 */
h5 + p, h6 + p {
display: inline !important;
text-indent: 0 !important; /* 如果标题和正文同行，则正文不缩进 */
}
/* ========== 段落和文本标准化 ========== */
p {
text-indent: 2em !important; /* 首行缩进 */
margin: 0 !important; /* 确保段落自身没有额外的上下边距，用行高控制 */
line-height: 1.5 !important; /* 使用倍数设置行高，更灵活 */
margin: 6pt 0 12pt 0 !important;
orphans: 3 !important;
widows: 3 !important;
font-size: 13pt !important;
line-height: 1.5 !important;
font-family: "Times New Roman", "SimSun", serif !important;
text-align: justify !important; /* 两端对齐，可选 */
}
/* 首段不缩进 */
body > p:first-child,
div > p:first-of-type,
section > p:first-of-type,
.chapter > p:first-of-type {
text-indent: 0 !important;
}
/* 特殊段落处理 */
.figure-caption, .table-caption {
text-indent: 0 !important;
text-align: center !important;
margin: 6pt 0 !important;
font-size: 11pt !important;
font-weight: normal !important;
}
/* 列表后的段落 */
ul + p, ol + p {
text-indent: 0 !important;
}
/* ========== 引用和注释标准化 ========== */
blockquote {
margin: 12pt 0 12pt 1.5cm !important;
padding: 6pt 12pt !important;
border-left: 3pt solid #ccc !important;
font-style: italic !important;
background-color: transparent !important;
}
/* ========== 表格标准化 ========== */
table {
border-collapse: collapse !important;
width: 100% !important;
margin: 12pt auto !important;
page-break-inside: avoid !important;
}
th, td {
border: 1pt solid #000 !important;
padding: 6pt 8pt !important;
text-align: left !important;
}
th {
font-weight: bold !important;
background-color: #f0f0f0 !important;
}
/* ========== 代码块标准化 ========== */
pre, code {
font-family: "Courier New", monospace !important;
font-size: 11pt !important;
}
pre {
background-color: #f8f8f8 !important;
border: 1pt solid #ddd !important;
padding: 12pt !important;
margin: 12pt 0 !important;
overflow: auto !important;
page-break-inside: avoid !important;
}
/* ========== 列表标准化 ========== */
ul, ol {
margin: 12pt 0 12pt 1.5cm !important;
padding: 0 !important;
}
li {
margin: 3pt 0 !important;
padding: 0 !important;
font-size: 13pt !important; /* 设置列表字号 */
}
/* ========== Callout标准化 ========== */
.callout {
font-family: "Times New Roman", "Times", serif !important;
border: 1pt solid #ddd !important;
border-radius: 0 !important;
margin: 12pt 0 !important;
page-break-inside: avoid !important;
background-color: #f9f9f9 !important;
break-inside: avoid !important;
}
.callout-title {
display: flex !important;
align-items: center !important;
font-weight: bold !important;
padding: 8pt 10pt !important;
border-bottom: 1pt solid #eee !important;
background-color: #f0f0f0 !important;
font-size: 12pt !important;
color: #000 !important;
}
.callout-icon {
display: inline-flex !important;
margin-right: 8pt !important;
color: #000 !important;
}
.callout-content {
padding: 10pt !important;
font-size: 12pt !important;
line-height: 1.5 !important;
}
/* ========== 链接处理 ========== */
a {
color: #000 !important;
text-decoration: none !important;
}
a[href^="http"]:after {
content: " (" attr(href) ")";
font-size: 10pt;
color: #666;
word-break: break-all;
}
/* ========== 分页控制 ========== */
table, figure, pre, .callout {
page-break-inside: avoid !important;
}
/* 避免在段落中间分页 */
p {
page-break-inside: avoid !important;
}
/* 章节开头强制新页 */
h1 {
page-break-before: always !important;
}
}
2 个赞
