<mark> 是 HTML 语义化高亮标签,浏览器默认黄底黑字;多数 Markdown 渲染器支持,但禁用 HTML 或启用安全策略的平台(如微信公众号、Hugo 默认配置)会失效;相比 style="background-color",<mark> 更易被保留且无需额外 CSS。

<mark> 标签是 HTML 原生支持的语义化标签,专门用于高亮文本中需要引起注意的部分,浏览器默认渲染为黄色背景+黑色文字。它不是 Markdown 语法,但绝大多数支持 HTML 的 Markdown 渲染器(如 GitHub、CSDN、Typora、Jupyter Notebook、Obsidian 默认模式等)都允许直接嵌入使用。
为什么 <mark> 在部分平台不生效?
根本原因是渲染环境禁用了 HTML 解析,或启用了严格安全策略(如某些静态站点生成器、企业内网文档系统、微信公众号编辑器)。常见现象包括:<mark> 标签原样显示为文本、被过滤掉、或只渲染出文字而无背景色。
- GitHub README.md:✅ 支持,但仅限于行内 HTML;
<pre><code>块内不支持嵌套<mark> - Jupyter Notebook:✅ 支持(需在 Markdown cell 中写
<mark>xxx</mark>) - 微信公众号后台:❌ 不支持,会被过滤或转义
- Hugo / Jekyll 默认配置:⚠️ 通常禁用 HTML,需手动开启
unsafe=true或启用goldmark扩展
<mark> 和 CSS background-color 的关键区别
直接用 style="background-color:yellow" 在多数受限环境里更大概率失效,因为 style 属性常被主动剥离;而 <mark> 是语义标签,被保留的概率更高,且无需额外 CSS 定义。
-
<mark>关键参数</mark>→ 简洁、语义明确、兼容性相对更好 -
<span style="background-color:#ff0">关键参数</span>→ 更灵活(可换色、加边框),但依赖渲染器允许 style 属性 - 想统一改颜色?必须控制全局 CSS:浏览器开发者工具里搜
mark { background: #fff3cd; },但该方式对纯 Markdown 输出无效
在代码块中高亮某一行或关键词?
标准 Markdown 代码块(```python)内部不解析 HTML,所以 <mark> 会直接显示为字符。真需求是「让代码里的某个变量/函数名醒目」,正确路径只有两条:
- 用支持行内高亮的渲染器:例如 VS Code 预览 +
markdown-preview-enhanced插件,或 Typora 启用「代码块高亮扩展」 - 退而求其次,在代码块外加说明:用
<mark>标注上下文,比如<mark>注意:下面 model.to(device) 必须在实例化后立即调用</mark> - 绝对不要在
```里写<mark>—— 它不会变黄,只会变成乱码或报错
真正容易被忽略的是:高亮不是目的,可读性才是。同一段文档里混用 <mark>、<strong>、<code> 三类标签时,视觉权重容易打架。建议只在真正需要打断阅读流的关键提醒处用 <mark>,其他强调用 <strong>,代码片段始终走 <code>。否则黄色背景堆多了,反而没人注意到重点在哪。

















