markdig 默认不带样式和扩展语法支持,需手动构建含useadvancedextensions()等的markdownpipeline;它仅生成无class、无css的语义html,浏览器按默认样式渲染,故显示为“有结构、无表现”。

直接用 Markdig.Markdown.ToHtml() 就能转,但不配管道(pipeline)会丢扩展语法、表格、脚注等;默认输出也不带 CSS 样式,浏览器里显示出来是纯骨架——不是转换失败,是它本来就不负责样式。
为什么 Markdown.ToHtml() 输出的 HTML 看起来“没样式”
Markdig 默认只做语法解析和语义标记,比如把 **粗体** 变成 <strong>粗体</strong>,但不会自动加 <style></style> 或 class。浏览器按默认样式渲染 <h2></h2><ul></ul>,所以标题不醒目、列表没缩进、代码块没背景色——不是 bug,是设计如此。
- 它不注入任何 CSS,连基础重置都没有
- 所有 HTML 元素都是裸标签,class 名默认为空(除非你显式配置渲染器)
- 如果你直接塞进
WebView2或写入文件后用浏览器打开,看到的就是“有结构、无表现”的原始 HTML
怎么让输出带基础样式和常用扩展支持
必须手动构造一个带扩展的 MarkdownPipeline,再传给 Markdown.ToHtml()。否则连表格、任务列表、脚注都解析不了。
- 装包时确认是官方
Markdig(作者 xoofx),别误装Markdig.Core或旧版 - 基础增强写法:
var pipeline = new MarkdownPipelineBuilder().UseAdvancedExtensions().Build(); - 如果要支持 GitHub 风格(如
:smile:表情、~~删除线~~),加.UseEmojiAndSmiley()和.UseAutoIdentifiers() - 自定义 class 名?得注册
HtmlRenderer并替换内置的HeadingRenderer等,不是改一两个参数的事
常见错误:空 div、乱码、图片路径失效
这些不是 Markdig 的问题,而是你喂给它的上下文不对:
- 中文乱码?确保输入字符串编码是 UTF-8,且输出 HTML 包含
<meta charset="utf-8">(DocumentText赋值前自己拼进去) - 图片显示为空?
这种相对路径在WebView2.DocumentText下无效——Web 控件不解析当前目录,得预处理为data:image/png;base64,...或改用Navigate()加临时文件 - 生成一堆空
<div></div>?检查是否误用了SoftlineBreakAsBr之类扩展,或 pipeline 构建时重复调用了UseXxx()
别踩这个坑:用 StringWriter + HtmlRenderer 手动接管输出
有人想“更可控”,就绕过 ToHtml(),自己 new HtmlRenderer 再 Render()。结果发现:表格没边框、代码块丢失语言标识、自定义容器(如 `Bootstrap、GenericAttributes)只在 pipeline 执行阶段注入,HtmlRenderer 单独用等于放弃全部扩展链。
真要深度定制,唯一正路是继承 HtmlObjectRenderer<t></t> 并注册到 pipeline,而不是跳过 pipeline 直接 render。否则你写的每行定制逻辑,都在对抗 Markdig 的设计前提。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











