直接调用markdown.markdown()仅生成无包裹的html片段,需手动添加结构、启用fenced_code和codehilite扩展(依赖pygments)、显式指定utf-8编码,并处理file://协议下内联样式失效问题。

直接用 markdown 库就能跑通基础流程,但默认输出不带样式、不处理代码块高亮、也不支持自定义 HTML 模板——这些才是实际用起来卡住的地方。
为什么不能只调用 markdown.markdown()
它只返回纯 HTML 片段(比如 <p>Hello</p>),没有 、 包裹,浏览器直接打开会乱码;更麻烦的是,遇到 ```python ... ``` 这类代码块,默认只转成 <pre class="brush:php;toolbar:false;"><code>...</code></pre>,没语法高亮,也没 class 属性供 CSS 选中。
- 必须手动拼接
结构,或用md = markdown.Markdown(extensions=['fenced_code'])启用扩展 - 要高亮就得加
['codehilite']扩展,并确保系统装了pygments(pip install pygments) -
codehilite默认用 inline style,若想用外部 CSS,得配css_class='highlight'并自己写.highlight pre规则
如何让输出包含完整 HTML 页面结构
别依赖第三方模板引擎,用 Python 字符串格式化最稳。关键点是:把 markdown.markdown() 的结果塞进预定义的 HTML 骨架里,同时保留原始 Markdown 文件的编码(通常是 UTF-8)。
- 读文件时显式指定
encoding='utf-8',否则中文会报UnicodeDecodeError - 骨架里留好
{content}占位符,用.format(content=html_body)注入 - 如果需要页面标题,可从 Markdown 文件第一行提取(如
# My Doc),或用markdown.extensions.meta解析 YAML front matter
template = """
<meta charset="utf-8"><title>{title}</title>{content}
"""
怎样处理图片路径和相对链接
原始 Markdown 里的  在转成 HTML 后,路径仍是相对的,直接双击 HTML 文件打开会 404——因为浏览器以 HTML 文件所在目录为根,而你的图片可能在子目录里。
- 最简单方案:用
markdown.extensions.md_in_html不够,得靠markdown.extensions.attr_list+ 自定义处理器,但太重 - 轻量做法:转完 HTML 后用正则替换
src="(.+?)"为src="file:///{abs_path}",其中abs_path是图片相对于当前脚本的绝对路径 - 更稳妥的是生成时就用
base_url参数(需配合markdown.extensions.tables等扩展),但原生markdown库不支持,得换mistune或手写解析器
为什么本地双击 HTML 看不到代码高亮
因为 codehilite 默认生成的是内联 style,但 Chrome 等浏览器在 file:// 协议下会禁用内联样式(CSP 限制),导致高亮失效。
- 临时解法:启动本地 HTTP 服务,比如
python -m http.server 8000,然后访问http://localhost:8000/output.html - 长期方案:关掉
codehilite的 inline 模式,改用pygments输出 CSS 文件:from pygments.formatters import HtmlFormatter; open('style.css', 'w').write(HtmlFormatter().get_style_defs()) - 注意:生成的 CSS 里 class 名如
.highlight .k,对应 HTML 中<span class="k">def</span>,所以必须保证codehilite和pygments版本匹配,否则 class 名对不上
真正麻烦的不是转换本身,而是路径、编码、协议限制这三件事缠在一起——改一个,另外两个容易崩。动手前先确认你的 Markdown 文件在哪、目标 HTML 存哪、打算怎么打开它。
Python免费学习笔记(深入):立即使用
在学习笔记中,你将探索 Python 的核心概念和高级技巧!











