课文生词整理 Skill

适用场景

• 英文课文 PDF（扫描版/图片型）生词整理
• 需要输出可打印 HTML（A4 排版，两栏对照）
• 生词要求：音标、词性（vi/vt 区分）、释义、同源词、近义词

Step 1：PDF → 图片

用 PyMuPDF 将 PDF 每页转成 PNG（300 DPI，保证识别精度）：

import fitz
import os

pdf_path = r"C:/path/to/textbook.pdf"
output_dir = "pdf_images"
os.makedirs(output_dir, exist_ok=True)

doc = fitz.open(pdf_path)
zoom = 300 / 72
mat = fitz.Matrix(zoom, zoom)

for page_num in range(len(doc)):
    page = doc[page_num]
    pix = page.get_pixmap(matrix=mat)
    out = os.path.join(output_dir, f"page_{page_num+1:03d}.png")
    pix.save(out)
    print(f"已生成：{out}")

> 输出：pdf_images/page_001.png, page_002.png ...

Step 2：图片 → 文字识别（⚠️ 关键步骤）

使用多模态模型（Hy3 等）识别图片中的英文文本。

⚠️ 必须强调：段落结构 + 打印适配！

识别 prompt 中必须包含以下要求（直接复制给模型）：

请识别这张图片中的英文课文内容。

严格要求：
1. 【最重要】必须准确识别并保留原文的段落结构！每个段落之间用空行分隔。
2. 不要把多个段落合并成一个段落。
3. 段落内的换行可以保留，但段落之间必须有明确分隔（空一行）。
4. 识别章节标题（如有）。
5. 不要识别页眉、页脚、页码、页码旁边的注释。

输出格式：每个段落之间用空行分隔，便于后续程序处理。

如果识别结果段落仍丢失，需手动根据原文 PDF 视觉分页位置，在文本中插入空行分隔段落，再进行下一步。

Step 3：提取课文正文

从识别文本中剔除：

• 页眉 / 页脚 / 页码
• 词汇表页（通常在课文前/后）
• 练习、注释等非正文内容

只保留课文正文（每个章节的标题 + 段落文本）。

Step 4：识别生词（初中水平）

分析正文，筛选出对初中生是生词的英文单词：

• 动词统一还原为原形（如 embarked → embark）
• 忽略过于简单的词（a, the, is, are 等）
• 忽略专有名词（人名、地名，除非是词汇表要求）

生词列表去重。

Step 5：生成每个生词的详细信息

对每个生词，生成以下内容（可用 AI 辅助）：

HTML 中每行格式（合并在一行，节省空间）：

embark /ɪmˈbɑːk/ vi. & vt. 上船；开始做
  同源词：embarkation n. 上船；disembark v. 下船
  近义词：board, commence, begin

Step 6：生成 HTML（两栏对照布局）

⚠️ 核心要求：左右水平对齐 + 打印适配！

每个 vocab-block = 一小段课文 + 该段对应的生词

• 左侧课文（text-col）和右侧生词（vocab-col）必须水平对齐
• 不能把整章课文放在一个 block 里，否则右侧生词会对不齐
• 按课文自然分段，每段对应一个 vocab-block
• 竖线用真实 DOM 元素（不用伪元素 ::before），否则打印时不显示！

布局结构

┌─────────────────┬───┬─────────────────┐
│  课文正文        │   │  生词详情        │
│  (text-col)    │ 竖线│  (vocab-col)   │
│  每段一个block   │   │  与左侧水平对齐   │
└─────────────────┴───┴─────────────────┘

核心 HTML 结构

<div class="main-wrapper">
  <div class="vline-div"></div>  <!-- 竖线：真实DOM元素，打印可靠 -->
  <h2>章节标题</h2>

  <!-- 每个 vocab-block = 一段课文 + 对应生词 -->
  <div class="vocab-block">
    <div class="text-col">
      <p>课文段落（生词用 <b> 加粗黑色）</p>
    </div>
    <div class="vocab-col">
      <div class="vline"><span class="vw">word</span> /IPA/ pos. 释义</div>
      <div class="vline"><span class="vlabel">同源词：</span>...</div>
      <div class="vline"><span class="vlabel">近义词：</span>...</div>
    </div>
  </div>
</div>

关键 CSS（已优化打印 + 边距）

body {
  font-family: 'Times New Roman', 'SimSun', serif;
  max-width: 800px;
  margin:0 auto;
  padding: 10px 5px;  /* 左右边距缩小 */
  line-height:1.6;
}
.main-wrapper {
  position: relative;
  margin-top: 15pt;
}
.vline-div {
  /* 竖线：真实DOM元素，打印时确保显示 */
  position: absolute;
  left: 50%; top:0; bottom:0;
  width:1px; background: #999;
  transform: translateX(-50%); z-index:0;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.vocab-block {
  display: flex; gap: 20px;
  margin-bottom: 12pt;
  align-items: flex-start;
  page-break-inside: avoid;  /* 打印时不被分页截断 */
  position: relative; z-index:1;
}
.text-col {
  flex:1; font-size: 11pt; line-height:1.7;
  text-align: left;          /* 左对齐（非两端对齐） */
  padding-right: 5px;       /* 左边距缩小 */
}
.text-col p { margin:0 0 8pt 0; }
.text-col p + p { text-indent: 2em; }
.vocab-col {
  flex:1; font-size:9pt; line-height:1.5;
  padding-left: 5px;        /* 右边距缩小 */
}
.vw { color: #8B0000; font-weight: bold; }  /* 生词暗红色加粗 */
.vlabel { color: #666; }                    /* 标签深灰色 */

打印适配（A4）

@media print {
  body { margin:0; padding: 15mm 10mm 20mm 15mm; max-width:100%; }
  @page {
    size: A4;
    margin: 15mm 10mm 20mm 15mm;
    @bottom-right {
      content: "第 " counter(page) " 页";
      font-size: 9pt; color: #666;
    }
  }
  .vline-div { top:0; bottom:0; }  /* 打印时竖线全高显示 */
  h2 { page-break-after: avoid; }
  .vocab-block { page-break-inside: avoid; }
  .text-col p { orphans:2; widows:2; }
}

完整输出检查清单

• [ ] 图片识别段落结构是否准确（各段落之间有空行）
• [ ] 课文左侧生词是否用 黑色加粗
• [ ] 右侧生词是否暗红色 #8B0000 加粗
• [ ] 右侧字体是否为 9pt
• [ ] 音标、词性、释义是否合并在一行
• [ ] "同源词：""近义词："标签是否为深灰色 #666
• [ ] 章节标题是否为深蓝色 #003366，15pt
• [ ] 两栏之间是否有 1px 灰色竖线（真实DOM元素，非伪元素）
• [ ] 打印预览 A4 分页是否正常（无单词被截断）
• [ ] 页码 "第 X 页" 是否显示在右下角
• [ ] 左侧课文是否为左对齐（text-align: left）
• [ ] 左右边距是否已缩小（body { padding: 10px 5px; }）

常见问题

Q：图片识别后段落全连在一起？

A：重新识别，在 prompt 中加强调段落结构。若模型不支持，需手动参照 PDF 图片在文本中插入空行。

Q：左右两栏不对齐？

A：确保每个