Markdown 下划线:4 种方法完整教程

Markdown 原生语法里没有下划线。John Gruber 在 2004 年设计 Markdown 的时候就故意没加这个功能,原因很简单:网页上带下划线的文字,几乎都会让人以为是超链接。

但实际需求是绕不开的——写报告要标注重点,记笔记要高亮关键词,有些论文格式甚至明确要求使用下划线。我在 GitHub、GitLab、Typora、Obsidian、Jupyter Notebook 和 Discord 上反复测试过各种下划线方法,这篇文章把所有靠谱的方案都整理出来了,按需取用就好。

方法一:<u> 标签(最常用)

这是最直接的方案。Markdown 支持内联 HTML,所以直接用 HTML 的下划线标签就行:

<u>这段文字会显示下划线</u>

渲染效果:这段文字会显示下划线

用在句子里

请注意,<u>截止日期是下周五</u>,逾期不予受理。

渲染效果:请注意,截止日期是下周五,逾期不予受理。

<u> 标签的兼容性

平台是否支持备注
GitHub(README)部分支持普通文本有效,标题中不支持
GitLab支持
Typora支持
VS Code 预览支持
Obsidian支持
Jupyter Notebook支持
Jekyll / Hugo支持
GitHub Issues/PR不支持需用 <ins> 替代

说实话,<u> 标签在大部分场景下都够用了。但在 GitHub 的 Issue 评论和 PR 描述里,它会被过滤掉。这种情况下就得用下面提到的 <ins> 标签。

顺便提一句,<u> 标签在 HTML4 时代曾被标记为"已废弃"(deprecated),但 HTML5 规范中已经恢复使用。官方给它的语义定义是"带有未表达的、但明确呈现的非文本注释的文本"。所以放心用,不会过时。

方法二:<ins> 标签(GitHub 推荐方案)

<ins> 是 HTML 的"插入"标签,语义上表示"新增的内容",通常和 <del>(删除标签)配合使用。大多数 Markdown 渲染器会把它显示为下划线效果:

<ins>这段文字也会显示下划线</ins>

渲染效果:这段文字也会显示下划线

什么时候该用 <ins> 而不是 <u>

如果你主要在 GitHub 上写文档(Issue、PR 描述、评论),推荐直接用 <ins>

### <ins>重要标题</ins>

这段代码在 GitHub 上可以正常渲染出带下划线的标题。换成 <u> 就不行——GitHub 的 Markdown 渲染器在标题和 Issue 评论中会过滤掉 <u> 标签,但放过了 <ins>

有次我在写一个 PR 描述时想给标题加下划线,用了 <u> 怎么都不生效,后来翻 Stack Overflow 才发现 GitHub 对这俩标签的处理方式不一样。从那以后,凡是在 GitHub 上用下划线,我都默认用 <ins>

<u><ins> 的区别

标签语义HTML5 状态GitHub 标题GitHub 正文
<u>未表达的注释有效不支持部分支持
<ins>新增内容有效支持支持

从语义上讲,如果你只是想给文字加下划线做强调,用 <u> 更准确;如果是表示"新增/插入"的内容,用 <ins> 更合适。但在实际使用中,很多平台对 <ins> 的兼容性更好,尤其是 GitHub。

方法三:CSS text-decoration 样式(最灵活)

如果你的 Markdown 渲染环境支持 CSS(比如自己搭建的博客、Hugo/Jekyll 站点),可以用内联样式实现更精细的控制:

<span style="text-decoration: underline;">带下划线的文字</span>

渲染效果:带下划线的文字

这个方法的好处是可以搭配其他样式:

<span style="text-decoration: underline wavy red;">红色波浪下划线</span>

渲染效果:红色波浪下划线

text-decoration 支持的样式值还挺多:

效果
underline普通下划线
underline wavy波浪线
underline dotted点状线
underline dashed虚线
underline double双线
underline red红色下划线
underline wavy red 2px红色波浪线,2px 粗细

不过要注意,GitHub 会过滤掉所有内联 CSS 样式,所以这个方法在 GitHub 上完全无效。另外,Discord、Obsidian 的实时预览等场景也不支持自定义 CSS。

方法四:Discord 专用语法 __下划线__

如果你是在 Discord 里用 Markdown,那恭喜你——Discord 有自己的下划线专用语法,不需要 HTML 标签:

__这段文字会显示下划线__

两个下划线包裹文字就行了,非常方便。Discord 还支持下划线和其他格式的组合:

__*下划线斜体*__
__**下划线粗体**__
__***下划线粗斜体***__

需要强调的是,这是 Discord 自己扩展的语法,不是标准 Markdown。在其他平台上 __文字__ 通常会被渲染成粗体,而不是下划线。

各平台下划线方法速查表

把上面的信息汇总一下,方便快速查阅:

方法语法GitHubTyporaObsidianJupyterDiscord自建博客
<u> 标签<u>文字</u>部分支持支持支持不适用支持
<ins> 标签<ins>文字</ins>支持支持支持支持不适用支持
CSS 样式<span style="text-decoration:underline">不支持支持部分支持支持不适用支持
Discord 语法__文字__粗体粗体粗体粗体下划线粗体

两个小技巧

用 LaTeX 实现下划线

如果平台支持 LaTeX 数学公式渲染(比如 Jupyter Notebook、Obsidian),还可以用 LaTeX 命令:

$\underline{带下划线的文字}$

这种方式适合需要精确排版控制的学术场景,但日常用起来比较麻烦,而且只在支持 LaTeX 的环境里有效。

VS Code 插件辅助

如果你经常在 VS Code 里写 Markdown,可以安装 Markdown Underline 插件。它会自动把 ++文字++ 转换为下划线效果,用起来比手写 HTML 标签方便一些。不过要注意,这依赖 markdown-it 解析器的 underline 插件,不是所有渲染器都能识别 ++ 语法。

常见问题

Markdown 为什么没有原生的下划线语法?

因为网页上超链接默认就是下划线样式,如果再加一个下划线语法,读者很容易分不清哪些是链接、哪些是普通强调。这也是为什么很多 Markdown 教程会建议用加粗斜体来替代下划线做文字强调。

<u><ins> 到底该用哪个?

简单说:在 GitHub 上用 <ins>,其他平台用 <u>。如果嫌麻烦,全部用 <ins> 也行,反正效果一样。

能给标题加下划线吗?

可以,在标题中嵌入 HTML 标签即可:

## <ins>带下划线的标题</ins>

在 GitHub 上记得用 <ins> 而不是 <u>

下划线和删除线能一起用吗?

可以,嵌套使用即可:

<u>~~这段文字同时有下划线和删除线~~</u>

渲染效果:这段文字同时有下划线和删除线

参考来源

总结

Markdown 下划线本身没有原生语法,但通过 HTML 标签可以轻松实现。大多数情况下 <u>文字</u> 就够了,在 GitHub 上用 <ins>文字</ins> 更稳妥,需要精细控制时可以用 CSS 的 text-decoration 样式。语法没几行,但不同平台的兼容性差异确实值得注意——选对方法,少走弯路。