02.网页代码在批量制卡上的应用
<p>本视频讲述了在Anki中利用网页代码进行内容粘贴、格式识别与批量制卡的应用场景及操作方法，重点解析了常见HTML标签（如加粗、斜体、下划线、换行、表格和图片）的代码结构及其在制卡过程中的实际运用，并通过文本替换实现下划线挖空与按换行分割批量生成卡片的技术路径。</p>
<p>【02.网页代码在批量制卡上的应用】</p>
<h2><a href="https://www.bilibili.com/video/BV14NHJzTEpu/?share_source=copy_web&vd_source=aa0bf1c05d4ce84f835055deef278df5">https://www.bilibili.com/video/BV14NHJzTEpu/?share_source=copy_web&vd_source=aa0bf1c05d4ce84f835055deef278df5</a></h2>
<ul>
<li>
<p><strong>四种方式的应用场景 <a href="#?seek_t=0">00:00</a></strong></p>
<ul>
<li>当从外部大量粘贴内容，但仅需其中部分添加到Anki时，可通过右键菜单选择特定内容制卡。</li>
<li>若某段内容为题目，可选中后直接制成客观题卡片，实现精准制卡。</li>
</ul>
</li>
<li>
<p><strong>制卡助手以网页代码为核心的设计原因 <a href="#?seek_t=38">00:38</a></strong></p>
<ul>
<li>Anki本身基于网页技术构建，卡片的本质就是HTML代码。</li>
<li>其内置编辑器包含网页编辑功能，但未集成独立的表格或PDF编辑器，因其核心架构依赖HTML。</li>
</ul>
</li>
<li>
<p><strong>学习网页代码的必要性与基本概念 <a href="#?seek_t=101">01:41</a></strong></p>
<ul>
<li><strong>无需深入学习</strong>：不需要掌握完整的网页设计或前端开发，只需理解粘贴到编辑区的内容本质上都是网页代码。</li>
<li><strong>建立核心认知</strong>：所有粘贴至编辑区的内容均以HTML形式存在，具备此认知是进行后续操作的基础。</li>
</ul>
</li>
<li>
<p><strong>常见的网页代码（HTML标签）示例 <a href="#?seek_t=130">02:10</a></strong></p>
<ul>
<li><strong>横线 <code>&lt;hr&gt;</code> <a href="#?seek_t=134">02:14</a></strong></li>
<li>使用 <code>&lt;hr&gt;</code> 标签可插入一条横线，该标签无需结束标签。</li>
<li><strong>加粗 <code>&lt;b&gt;</code> 或 <code>&lt;strong&gt;</code> <a href="#?seek_t=223">03:43</a></strong></li>
<li>加粗效果可用 <code>&lt;b&gt;</code> 或 <code>&lt;strong&gt;</code> 标签实现，在此场景下二者视觉效果等效。</li>
<li>完整结构为：<code>&lt;b&gt;加粗内容&lt;/b&gt;</code>。</li>
<li><strong>斜体 <code>&lt;i&gt;</code> 或 <code>&lt;em&gt;</code> <a href="#?seek_t=287">04:47</a></strong></li>
<li>斜体效果使用 <code>&lt;i&gt;</code> 或 <code>&lt;em&gt;</code> 标签，同样视为等效。</li>
<li>完整结构为：<code>&lt;i&gt;斜体内容&lt;/i&gt;</code>。</li>
<li><strong>下划线 <code>&lt;u&gt;</code> <a href="#?seek_t=293">04:53</a></strong></li>
<li>下划线由 <code>&lt;u&gt;</code> 标签实现，格式为 <code>&lt;u&gt;下划线内容&lt;/u&gt;</code>。</li>
<li><strong>换行 <code>&lt;br&gt;</code> <a href="#?seek_t=310">05:10</a></strong></li>
<li><code>&lt;br&gt;</code> 标签表示换行，无结束标签。</li>
<li>在代码编辑区中直接按回车不会在预览中换行，必须使用 <code>&lt;br&gt;</code> 标签才能生效。</li>
<li><strong>表格 <code>&lt;table&gt;</code>, <code>&lt;tr&gt;</code>, <code>&lt;td&gt;</code> <a href="#?seek_t=329">05:29</a></strong></li>
<li>表格的显示依赖于 <code>&lt;table&gt;</code>（定义表格）、<code>&lt;tr&gt;</code>（定义行）、<code>&lt;td&gt;</code>（定义单元格）等HTML标签。</li>
<li>即使模板未专门定义样式，只要存在正确的表格代码，即可渲染出表格结构。</li>
<li><strong>插入图片 <code>&lt;img&gt;</code> <a href="#?seek_t=373">06:13</a></strong></li>
<li>图片的基本格式为 <code>&lt;img src=&quot;图片地址&quot;&gt;</code>。</li>
<li><strong>地址要求</strong>：<code>src</code> 属性必须指向Anki账户媒体目录内的本地文件，否则将显示“缺失媒体”。</li>
<li><strong>引用方式</strong>：网络图片会生成复杂的长地址代码；本地图片则直接引用其在媒体库中的相对路径。</li>
<li><strong>媒体管理</strong>：若从媒体目录中删除了某图片，则所有引用该图片的卡片预览将无法加载，并提示媒体缺失。</li>
</ul>
</li>
<li>
<p><strong>HTML标签语法结构说明 <a href="#?seek_t=597">09:57</a></strong></p>
<ul>
<li><strong>成对标签</strong>：大多数标签由开始标签和结束标签两部分组成，结束标签在标签名前加斜杠 <code>/</code>，例如 <code>&lt;b&gt;加粗&lt;/b&gt;</code>。</li>
<li><strong>自闭合标签</strong>：少数特殊标签如 <code>&lt;hr&gt;</code>（横线）和 <code>&lt;br&gt;</code>（换行）无需结束标签。</li>
</ul>
</li>
<li>
<p><strong>网页代码的实际应用：批量制卡流程 <a href="#?seek_t=662">11:02</a></strong></p>
<ul>
<li><strong>将下划线内容转为挖空题 <a href="#?seek_t=662">11:02</a></strong>
<ol>
<li><strong>初始状态</strong>：原内容中答案部分由 <code>&lt;u&gt;下划线&lt;/u&gt;</code> 标签标出，每道题后用 <code>&lt;br&gt;</code> 换行符分隔。</li>
<li><strong>文本替换</strong>：利用文本替换功能，将 <code>&lt;u&gt;</code> 替换为挖空起始标识，并在 <code>&lt;/u&gt;</code> 前加入结束标识。</li>
<li><strong>生成格式</strong>：最终形成智能模板能够识别的标准挖空格式。</li>
<li><strong>效果验证</strong>：添加卡片后，答案部分自动呈现为黄色背景的挖空效果。</li>
<li><strong>功能等效</strong>：此操作与直接使用软件内置的“下划线挖空”功能效果相同。</li>
</ol></li>
<li><strong>按换行分割实现批量添加 <a href="#?seek_t=794">13:14</a></strong>
<ol>
<li><strong>模式识别</strong>：分析内容结构，发现每道题后均有 <code>&lt;br&gt;</code> 换行符作为天然分隔。</li>
<li><strong>视觉优化（可选）</strong>：为便于视觉区分，可尝试将 <code>&lt;br&gt;</code> 替换为如横线等内容分隔符。</li>
<li><strong>执行分割</strong>：实际操作中无需替换，直接使用“批量添加”功能并点击“分割卡片”。</li>
<li><strong>自动处理</strong>：系统会根据换行符 <code>&lt;br&gt;</code> 自动拆分内容，删除可能多余的分隔内容后，每道题即成为一张独立的卡片。</li>
<li><strong>批量设置</strong>：批量添加功能支持统一指定目标牌组与模板，适用于单张或多张卡片的批量生成。</li>
<li><strong>大数据量处理</strong>：若数据量极大，可导出文本文件再导入Anki以完成批量处理。</li>
</ol></li>
</ul>
</li>
<li>
<p><strong>网页代码的进阶用途与注意事项 <a href="#?seek_t=884">14:44</a></strong></p>
<ul>
<li>后续将介绍的正则替换等高级功能同样基于HTML代码处理，因此掌握基础至关重要。</li>
<li>为直观展示标签含义，可临时将 <code>&lt;u&gt;</code>（下划线）替换为 <code>&lt;s&gt;</code>（删除线）或 <code>&lt;b&gt;</code>（加粗）进行对比演示，此举虽无直接制卡意义，但有助于深化对标签作用的理解。</li>
<li><strong>媒体文件管理问题 <a href="#?seek_t=923">15:23</a></strong></li>
<li><strong>添加前状态</strong>：在添加包含图片的卡片前，若图片已存在于媒体目录但尚未被任何卡片引用，执行“检查媒体”时会提示该文件“未被使用”。</li>
<li><strong>添加后状态</strong>：成功添加卡片后，图片即被正式引用，再次检查媒体则不再报错。</li>
<li><strong>批量注意事项</strong>：在批量添加含图片的卡片过程中，需注意媒体的同步引用状态，避免出现媒体缺失的警告。</li>
</ul>
</li>
<li><strong>小结 <a href="#?seek_t=877">14:37</a></strong>
<ul>
<li>当前所讲解的为网页代码在Anki制卡中的基础应用，后续课程将在正则替换、模板设计等环节中进行更深入的拓展。</li>
</ul></li>
</ul>