[{"data":1,"prerenderedAt":40},["ShallowReactive",2],{"i-lucide:grip":3,"i-lucide:chevron-right":8,"i-lucide:moon":10,"i-lucide:sun":12,"i-lucide:languages":14,"i-lucide:chevron-down":16,"i-lucide:shield-check":18,"i-lucide:mail":20,"blog-body-markdown-basic-syntax-tutorial-zh":22,"i-lucide:lightbulb":23,"i-lucide:file-text":25,"i-lucide:pen-tool":27,"i-lucide:code":29,"i-lucide:pen-line":31,"i-lucide:file-code-2":33,"i-lucide:share-2":36,"i-lucide:star":38},{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":7},0,24,false,"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Ccircle cx=\"12\" cy=\"5\" r=\"1\"\u002F>\u003Ccircle cx=\"19\" cy=\"5\" r=\"1\"\u002F>\u003Ccircle cx=\"5\" cy=\"5\" r=\"1\"\u002F>\u003Ccircle cx=\"12\" cy=\"12\" r=\"1\"\u002F>\u003Ccircle cx=\"19\" cy=\"12\" r=\"1\"\u002F>\u003Ccircle cx=\"5\" cy=\"12\" r=\"1\"\u002F>\u003Ccircle cx=\"12\" cy=\"19\" r=\"1\"\u002F>\u003Ccircle cx=\"19\" cy=\"19\" r=\"1\"\u002F>\u003Ccircle cx=\"5\" cy=\"19\" r=\"1\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":9},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m9 18l6-6l-6-6\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":11},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":13},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Ccircle cx=\"12\" cy=\"12\" r=\"4\"\u002F>\u003Cpath d=\"M12 2v2m0 16v2M4.93 4.93l1.41 1.41m11.32 11.32l1.41 1.41M2 12h2m16 0h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":15},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m5 8l6 6m-7 0l6-6l2-3M2 5h12M7 2h1m14 20l-5-10l-5 10m2-4h6\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":17},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m6 9l6 6l6-6\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":19},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"\u002F>\u003Cpath d=\"m9 12l2 2l4-4\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":21},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"m22 7l-8.991 5.727a2 2 0 0 1-2.009 0L2 7\"\u002F>\u003Crect width=\"20\" height=\"16\" x=\"2\" y=\"4\" rx=\"2\"\u002F>\u003C\u002Fg>","\u003Cblockquote>\n\u003Cp>刚接触 Markdown 的人常被 \u003Ccode>#\u003C\u002Fcode>、\u003Ccode>*\u003C\u002Fcode>、反引号劝退，其实\u003Cstrong>日常写作真正高频的语法只有十个左右\u003C\u002Fstrong>。把这十个练熟，就能写博客、README、笔记、周报。本文每个语法都给「源码 + 渲染效果」对照，并附上可直接复制到编辑器里动手改的例子。\u003C\u002Fp>\n\u003C\u002Fblockquote>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Fcover.webp\" alt=\"Markdown 高频语法：源码与渲染效果对照\">\u003C\u002Fp>\n\u003Ch2>Markdown 是什么？为什么值得学？\u003C\u002Fh2>\n\u003Cp>Markdown 是一套用普通符号给纯文本「标记排版」的轻量语法：你用 \u003Ccode>#\u003C\u002Fcode> 标记标题、\u003Ccode>*\u003C\u002Fcode> 标记重点、\u003Ccode>-\u003C\u002Fcode> 标记列表，渲染器再把这些符号变成真正的排版。它的价值在于\u003Cstrong>内容与格式分离\u003C\u002Fstrong>——源码本身就清晰可读，同一份 \u003Ccode>.md\u003C\u002Fcode> 还能一键转成 HTML、Word、PDF，或发到公众号、小红书。\u003C\u002Fp>\n\u003Cp>正因如此，GitHub、各类笔记软件、静态博客、AI 对话框几乎都把 Markdown 当默认书写格式。学习成本极低：不需要鼠标在工具栏里点来点去，双手不离键盘就能排版。下面从最高频的十个语法讲起，看完就能上手。\u003C\u002Fp>\n\u003Ch2>标题怎么写？用几个 \u003Ccode>#\u003C\u002Fcode> 决定层级\u003C\u002Fh2>\n\u003Cp>标题用行首的 \u003Ccode>#\u003C\u002Fcode> 表示，几个 \u003Ccode>#\u003C\u002Fcode> 就是几级标题，\u003Cstrong>\u003Ccode>#\u003C\u002Fcode> 与文字之间必须留一个空格\u003C\u002Fstrong>。一级标题通常作为全文大标题，正文里的小节多用二级（\u003Ccode>##\u003C\u002Fcode>）、三级（\u003Ccode>###\u003C\u002Fcode>）。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>边学边练：\u003C\u002Fstrong> 打开 \u003Ca href=\"\u002Fmarkdown\u002Fedit\u002F\">Markdown 在线编辑器\u003C\u002Fa>，把下面的示例复制到左侧，再对照右侧实时预览改一改 \u003Ccode>#\u003C\u002Fcode> 的数量；后面每节语法都可以用同样方式动手练。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold\"># 一级标题（全文大标题）\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold\">## 二级标题（章节）\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold\">### 三级标题（小节）\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold\">#### 四级标题\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>渲染效果如下（截自在线编辑器预览）：\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Fheadings.webp\" alt=\"标题层级的渲染效果\">\u003C\u002Fp>\n\u003Cp>新手最常见的坑就是把 \u003Ccode>#标题\u003C\u002Fcode> 写在一起——少了空格，多数渲染器不会识别成标题，而是原样显示。层级也不要跳级（从 \u003Ccode>#\u003C\u002Fcode> 直接跳到 \u003Ccode>###\u003C\u002Fcode>），保持规整对后续转 Word\u002FPDF 生成目录很重要。\u003C\u002Fp>\n\u003Ch2>怎么加粗、倾斜、加删除线？\u003C\u002Fh2>\n\u003Cp>强调类语法用成对符号把文字包起来：\u003Cstrong>加粗\u003C\u002Fstrong>用两个星号 \u003Ccode>**文字**\u003C\u002Fcode>，\u003Cem>斜体\u003C\u002Fem>用一个星号 \u003Ccode>*文字*\u003C\u002Fcode>，\u003Cs>删除线\u003C\u002Fs>用两个波浪号 \u003Ccode>~~文字~~\u003C\u002Fcode>，三者还能叠加。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">这句话里有 \u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-font-weight:bold;--shiki-dark:#E1E4E8;--shiki-dark-font-weight:bold\">**加粗**\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">、\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-font-style:italic;--shiki-dark:#E1E4E8;--shiki-dark-font-style:italic\">*斜体*\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">、\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-font-weight:bold;--shiki-dark:#E1E4E8;--shiki-dark-font-weight:bold\">**\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-font-style:italic;--shiki-dark:#E1E4E8;--shiki-dark-font-style:italic\">*加粗又斜体*\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-font-weight:bold;--shiki-dark:#E1E4E8;--shiki-dark-font-weight:bold\">**\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">，还有 \u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-text-decoration:line-through;--shiki-dark:#E1E4E8;--shiki-dark-text-decoration:line-through\">~~划掉的旧价格~~\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">。\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Femphasis.webp\" alt=\"加粗、斜体、删除线的渲染效果\">\u003C\u002Fp>\n\u003Cp>一个细节：中文和符号之间不需要空格，但如果加粗内容紧贴中文有时不生效，可以在 \u003Ccode>**\u003C\u002Fcode> 两侧各留一个空格更保险。删除线特别适合写「原价 \u003Cs>99\u003C\u002Fs> 现价 39」这类对比。\u003C\u002Fp>\n\u003Ch2>无序、有序、任务清单怎么打？\u003C\u002Fh2>\n\u003Cp>列表分三种：无序列表用 \u003Ccode>- \u003C\u002Fcode>（或 \u003Ccode>* \u003C\u002Fcode>）开头，有序列表用 \u003Ccode>1. \u003C\u002Fcode> 开头，任务清单用 \u003Ccode>- [ ] \u003C\u002Fcode>（未完成）和 \u003Ccode>- [x] \u003C\u002Fcode>（已完成）。符号后面\u003Cstrong>都要跟一个空格\u003C\u002Fstrong>，缩进两个或四个空格可以形成子列表。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">无序列表：\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">-\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> 苹果\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">-\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> 香蕉\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">  -\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> 子项也能嵌套\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">有序列表：\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">1.\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> 打开编辑器\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">2.\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> 粘贴内容\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">3.\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> 导出文件\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">任务清单：\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">-\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> [\u003C\u002Fspan>\u003Cspan style=\"color:#032F62;--shiki-light-text-decoration:underline;--shiki-dark:#DBEDFF;--shiki-dark-text-decoration:underline\">x\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">] 已完成的事\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209;--shiki-dark:#FFAB70\">-\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\"> [ ] 还没做的事\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Flists.webp\" alt=\"无序、有序列表与任务清单的渲染效果\">\u003C\u002Fp>\n\u003Cp>有序列表的数字其实可以全写 \u003Ccode>1.\u003C\u002Fcode>，渲染时会自动递增编号，方便中途插入条目。任务清单是 GitHub 风格 Markdown（GFM）的扩展，非常适合写 TODO、检查清单。\u003C\u002Fp>\n\u003Ch2>怎么插入链接和图片？\u003C\u002Fh2>\n\u003Cp>链接的写法是 \u003Ccode>[显示文字](网址)\u003C\u002Fcode>，图片只是在前面多一个感叹号：\u003Ccode>![替代文字](图片地址)\u003C\u002Fcode>。两者结构几乎一样，区别就是图片会把内容渲染出来，而链接是可点击的文字。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">这是一个 [\u003C\u002Fspan>\u003Cspan style=\"color:#032F62;--shiki-light-text-decoration:underline;--shiki-dark:#DBEDFF;--shiki-dark-text-decoration:underline\">指向 MeTool 的链接\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">](\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-text-decoration:underline;--shiki-dark:#E1E4E8;--shiki-dark-text-decoration:underline\">https:\u002F\u002Fmetool.online\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">)。\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">这是一张图片：\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">![\u003C\u002Fspan>\u003Cspan style=\"color:#032F62;--shiki-light-text-decoration:underline;--shiki-dark:#DBEDFF;--shiki-dark-text-decoration:underline\">MeTool 标志\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">](\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-text-decoration:underline;--shiki-dark:#E1E4E8;--shiki-dark-text-decoration:underline\">https:\u002F\u002Fmetool.online\u002Fimages\u002Flogo-removebg.png\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">)\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Flink-image.webp\" alt=\"链接与图片的渲染效果\">\u003C\u002Fp>\n\u003Cp>图片的「替代文字」在图片加载失败或被朗读时显示，建议认真写。图片地址可以是网址，也可以是本地路径；在线编辑器里还支持直接把图片拖进去或粘贴，自动生成图片语法。\u003C\u002Fp>\n\u003Ch2>行内代码和代码块怎么写（带高亮）？\u003C\u002Fh2>\n\u003Cp>短的代码或命令用一对反引号包住变成 \u003Ccode>行内代码\u003C\u002Fcode>；多行代码用三个反引号 \u003Ccode>```\u003C\u002Fcode> 包起来成为代码块，并在开头反引号后写上语言名（如 \u003Ccode>js\u003C\u002Fcode>、\u003Ccode>python\u003C\u002Fcode>），就能得到语法高亮。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">安装依赖请运行 \u003C\u002Fspan>\u003Cspan style=\"color:#005CC5;--shiki-dark:#79B8FF\">`npm install`\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">。\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">```js\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49;--shiki-dark:#F97583\">function\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1;--shiki-dark:#B392F0\"> hello\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">() {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">  console.\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1;--shiki-dark:#B392F0\">log\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">(\u003C\u002Fspan>\u003Cspan style=\"color:#032F62;--shiki-dark:#9ECBFF\">'Hello Markdown'\u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">```\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Fcode.webp\" alt=\"行内代码与带高亮代码块的渲染效果\">\u003C\u002Fp>\n\u003Cp>反引号（\u003Ccode>`\u003C\u002Fcode>）在键盘左上角、数字 1 左边，注意别和单引号混淆。写技术笔记、README 时这是最常用的语法之一，标好语言名高亮才会生效。\u003C\u002Fp>\n\u003Ch2>引用块怎么写？\u003C\u002Fh2>\n\u003Cp>引用用行首的 \u003Ccode>> \u003C\u002Fcode> 表示，常用来标注重点结论、引用他人观点或做提示框。多段引用每行都加 \u003Ccode>>\u003C\u002Fcode>，还能在 \u003Ccode>>\u003C\u002Fcode> 后再嵌套 \u003Ccode>>\u003C\u002Fcode> 形成多层引用。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#22863A;--shiki-dark:#85E89D\">> 这是一段引用，适合放重点结论。\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#22863A;--shiki-dark:#85E89D\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#22863A;--shiki-dark:#85E89D\">> 引用里也能写 \u003C\u002Fspan>\u003Cspan style=\"color:#24292E;--shiki-light-font-weight:bold;--shiki-dark:#E1E4E8;--shiki-dark-font-weight:bold\">**加粗**\u003C\u002Fspan>\u003Cspan style=\"color:#22863A;--shiki-dark:#85E89D\"> 和 \u003C\u002Fspan>\u003Cspan style=\"color:#005CC5;--shiki-dark:#79B8FF\">`代码`\u003C\u002Fspan>\u003Cspan style=\"color:#22863A;--shiki-dark:#85E89D\">。\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Fquote.webp\" alt=\"引用块的渲染效果\">\u003C\u002Fp>\n\u003Cp>引用块在各平台的样式不同，但语义一致：把这段文字「降一级」标为旁注或摘录。文章开头用一句话引用做全文结论，是很常见的写法。\u003C\u002Fp>\n\u003Ch2>表格怎么画？\u003C\u002Fh2>\n\u003Cp>表格用竖线 \u003Ccode>|\u003C\u002Fcode> 分隔单元格，第二行用 \u003Ccode>---\u003C\u002Fcode> 作为表头和内容的分隔线，在 \u003Ccode>---\u003C\u002Fcode> 两侧加冒号可以控制对齐：\u003Ccode>:---\u003C\u002Fcode> 左对齐、\u003Ccode>:---:\u003C\u002Fcode> 居中、\u003Ccode>---:\u003C\u002Fcode> 右对齐。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">| 功能 | 是否常用 | 说明 |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">| :--- | :---: | ---: |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">| 标题 | 是 | 用 # 表示 |\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">| 表格 | 是 | 用竖线分隔 |\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cimg src=\"\u002Fblog\u002Fmarkdown-basic-syntax-tutorial\u002Ftable.webp\" alt=\"表格的渲染效果\">\u003C\u002Fp>\n\u003Cp>手写表格对齐符号很累，实用做法是\u003Cstrong>先在编辑器里用工具栏一键插入表格骨架\u003C\u002Fstrong>，再填内容；或者把已有的 Excel\u002F网页表格复制进支持粘贴转换的编辑器。\u003C\u002Fp>\n\u003Ch2>分割线和换行怎么处理？\u003C\u002Fh2>\n\u003Cp>分割线用单独一行的三个及以上连字符 \u003Ccode>---\u003C\u002Fcode>（或 \u003Ccode>***\u003C\u002Fcode>）表示，用来分隔大段落。换行则有个常见坑：Markdown 里\u003Cstrong>回车一次不会换行\u003C\u002Fstrong>，需要在行尾敲两个空格，或者直接空一行另起一段。\u003C\u002Fp>\n\u003Cpre class=\"shiki shiki-themes github-light github-dark mac-code-block\" style=\"background-color:#fff;--shiki-dark-bg:#24292e;color:#24292e;--shiki-dark:#e1e4e8\" tabindex=\"0\">\u003Cspan class=\"mac-lang-badge\">markdown\u003C\u002Fspan>\u003Ccode class=\"language-markdown\">\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">第一段。\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">第二段（中间空了一行）。\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#005CC5;--shiki-light-font-weight:bold;--shiki-dark:#79B8FF;--shiki-dark-font-weight:bold\">---\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E;--shiki-dark:#E1E4E8\">分割线下面的新内容。\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>分割线要和上文空一行，否则 \u003Ccode>---\u003C\u002Fcode> 紧贴文字会被误认成「上一行是标题」。段落之间统一用空行分隔，是最不容易出错的排版习惯。\u003C\u002Fp>\n\u003Ch2>十个高频语法速查表\u003C\u002Fh2>\n\u003Cp>把上面的内容浓缩成一张表，写作时忘了就扫一眼：\u003C\u002Fp>\n\u003Ctable>\n\u003Cthead>\n\u003Ctr>\n\u003Cth>语法\u003C\u002Fth>\n\u003Cth>写法\u003C\u002Fth>\n\u003Cth>效果\u003C\u002Fth>\n\u003C\u002Ftr>\n\u003C\u002Fthead>\n\u003Ctbody>\n\u003Ctr>\n\u003Ctd>标题\u003C\u002Ftd>\n\u003Ctd>\u003Ccode># 标题\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>分级标题\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>加粗\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>**文字**\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>粗体\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>斜体\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>*文字*\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>斜体\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>删除线\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>~~文字~~\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>划掉\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>无序列表\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>- 项目\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>圆点列表\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>有序列表\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>1. 项目\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>数字列表\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>任务清单\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>- [ ] 事项\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>可勾选框\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>链接\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>[文字](网址)\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>可点击链接\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>图片\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>![描述](地址)\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>显示图片\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>行内代码\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>`代码`\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>等宽标注\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>代码块\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>```语言\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>高亮代码\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>引用\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>> 文字\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>旁注\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>表格\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>| 单元 |\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>表格\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>分割线\u003C\u002Ftd>\n\u003Ctd>\u003Ccode>---\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>横线\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003C\u002Ftbody>\n\u003C\u002Ftable>\n\u003Ch2>边学边练：把例子贴进编辑器改一改\u003C\u002Fh2>\n\u003Cp>看懂不等于会写，最快的掌握方式是\u003Cstrong>动手改\u003C\u002Fstrong>。把上面任意一个例子复制到一个左边源码、右边实时预览的编辑器里，改一个符号，立刻就能看到渲染结果怎么变——比对着文档死记高效得多。\u003C\u002Fp>\n\u003Cp>推荐用 \u003Ca href=\"\u002Fmarkdown\u002Fedit\u002F\">Markdown 在线编辑器\u003C\u002Fa> 练习：它左边写、右边即时预览，草稿自动存在浏览器本地、内容不上传，还支持导入 \u003Ccode>.md\u003C\u002Fcode> 文件、粘贴图片。练熟之后，同一份稿子可以用 \u003Ca href=\"\u002Fmarkdown\u002Fconvert\u002F\">Markdown 转换工具\u003C\u002Fa> 导成 Word \u002F PDF，或用 \u003Ca href=\"\u002Fmarkdown\u002Fshare\u002F\">Markdown 在线分享\u003C\u002Fa> 生成预览链接发给别人。更多相关工具都在 \u003Ca href=\"\u002Fmarkdown\u002F\">Markdown 工具箱\u003C\u002Fa>。\u003C\u002Fp>\n\u003Ch2>小结\u003C\u002Fh2>\n\u003Cp>Markdown 的高频语法就这十来个：\u003Ccode>#\u003C\u002Fcode> 标题、\u003Ccode>**\u003C\u002Fcode> 加粗、\u003Ccode>*\u003C\u002Fcode> 斜体、\u003Ccode>-\u003C\u002Fcode>\u002F\u003Ccode>1.\u003C\u002Fcode> 列表、\u003Ccode>- [ ]\u003C\u002Fcode> 任务清单、\u003Ccode>[]()\u003C\u002Fcode> 链接、\u003Ccode>![]()\u003C\u002Fcode> 图片、\u003Ccode>`\u003C\u002Fcode> 代码、\u003Ccode>>\u003C\u002Fcode> 引用、\u003Ccode>|\u003C\u002Fcode> 表格、\u003Ccode>---\u003C\u002Fcode> 分割线。记住两条铁律——\u003Cstrong>符号和文字之间留空格、段落之间空一行\u003C\u002Fstrong>——就能避开绝大多数新手坑。剩下的，打开\u003Ca href=\"\u002Fmarkdown\u002Fedit\u002F\">在线编辑器\u003C\u002Fa>边写边看，一个下午就能上手。\u003C\u002Fp>\n\u003Cp>想继续学公式、流程图、折叠区块、上下标等进阶写法，请阅读 \u003Ca href=\"\u002Fblog\u002Fp\u002Fmarkdown-advanced-syntax\u002F\">Markdown 进阶语法教学\u003C\u002Fa>。\u003C\u002Fp>\n",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":24},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 14c.2-1 .7-1.7 1.5-2.5c1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5c.7.7 1.3 1.5 1.5 2.5m0 4h6m-5 4h4\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":26},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z\"\u002F>\u003Cpath d=\"M14 2v5a1 1 0 0 0 1 1h5M10 9H8m8 4H8m8 4H8\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":28},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M15.707 21.293a1 1 0 0 1-1.414 0l-1.586-1.586a1 1 0 0 1 0-1.414l5.586-5.586a1 1 0 0 1 1.414 0l1.586 1.586a1 1 0 0 1 0 1.414z\"\u002F>\u003Cpath d=\"m18 13l-1.375-6.874a1 1 0 0 0-.746-.776L3.235 2.028a1 1 0 0 0-1.207 1.207L5.35 15.879a1 1 0 0 0 .776.746L13 18M2.3 2.3l7.286 7.286\"\u002F>\u003Ccircle cx=\"11\" cy=\"11\" r=\"2\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":30},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m16 18l6-6l-6-6M8 6l-6 6l6 6\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":32},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 21h8m.174-14.188a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":34,"hidden":35},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4\"\u002F>\u003Cpath d=\"M14 2v4a2 2 0 0 0 2 2h4M5 12l-3 3l3 3m4 0l3-3l-3-3\"\u002F>\u003C\u002Fg>",true,{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":37},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Ccircle cx=\"18\" cy=\"5\" r=\"3\"\u002F>\u003Ccircle cx=\"6\" cy=\"12\" r=\"3\"\u002F>\u003Ccircle cx=\"18\" cy=\"19\" r=\"3\"\u002F>\u003Cpath d=\"m8.59 13.51l6.83 3.98m-.01-10.98l-6.82 3.98\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":39},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.12 2.12 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.12 2.12 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.12 2.12 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.12 2.12 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.12 2.12 0 0 0 1.597-1.16z\"\u002F>",1786455169858]