<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>Firefly</title><description>Demo site</description><link>https://firefly.cuteleaf.cn/</link><templateTheme>Firefly</templateTheme><templateThemeVersion>6.13.10</templateThemeVersion><templateThemeUrl>https://github.com/CuteLeaf/Firefly</templateThemeUrl><lastBuildDate>2026年7月15日 14:38:42</lastBuildDate><item><title>Firefly 一款清新美观的 Astro 博客主题模板</title><link>https://firefly.cuteleaf.cn/posts/firefly/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/firefly/</guid><description>Firefly 是一款基于 Astro 框架和 Fuwari 模板开发的清新美观且现代化个人博客主题模板，专为技术爱好者和内容创作者设计。该主题融合了现代 Web 技术栈，提供了丰富的功能模块和高度可定制的界面，让您能够轻松打造出专业且美观的个人博客网站。</description><pubDate>Fri, 02 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;🌟 项目概述&lt;a href=&quot;#-项目概述&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;Firefly&lt;/strong&gt; 是一款基于 Astro 框架和 Fuwari 模板开发的清新美观且现代化个人博客主题模板，专为技术爱好者和内容创作者设计。该主题融合了现代 Web 技术栈，提供了丰富的功能模块和高度可定制的界面，让您能够轻松打造出专业且美观的个人博客网站。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;🖥️在线预览： &lt;a href=&quot;https://firefly.cuteleaf.cn/&quot;&gt;Firefly - Demo site&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;🏠我的博客： &lt;a href=&quot;https://blog.cuteleaf.cn/&quot; target=&quot;_blank&quot;&gt;https://blog.cuteleaf.cn&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;📝Firefly使用文档： &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/&quot; target=&quot;_blank&quot;&gt;https://docs-firefly.cuteleaf.cn&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;⭐Firefly开源地址：&lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;https://github.com/CuteLeaf/Firefly&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;⭐Fuwari开源地址：&lt;a href=&quot;https://github.com/saicaca/fuwari&quot; target=&quot;_blank&quot;&gt;https://github.com/saicaca/fuwari&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;&lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;CuteLeaf&lt;/div&gt;&lt;/div&gt;&lt;div&gt;/&lt;/div&gt;&lt;div&gt;Firefly&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;Waiting for api.github.com...&lt;/div&gt;&lt;div&gt;&lt;div&gt;00K&lt;/div&gt;&lt;div&gt;0K&lt;/div&gt;&lt;div&gt;0K&lt;/div&gt;&lt;span&gt;Waiting...&lt;/span&gt;&lt;/div&gt;&lt;/a&gt;&lt;a href=&quot;https://github.com/saicaca/fuwari&quot; target=&quot;_blank&quot;&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;saicaca&lt;/div&gt;&lt;/div&gt;&lt;div&gt;/&lt;/div&gt;&lt;div&gt;fuwari&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;Waiting for api.github.com...&lt;/div&gt;&lt;div&gt;&lt;div&gt;00K&lt;/div&gt;&lt;div&gt;0K&lt;/div&gt;&lt;div&gt;0K&lt;/div&gt;&lt;span&gt;Waiting...&lt;/span&gt;&lt;/div&gt;&lt;/a&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;Firefly&quot; loading=&quot;lazy&quot; width=&quot;2201&quot; height=&quot;1238&quot; src=&quot;/_astro/1.DzpFX8mf_Z1gH7z7.webp&quot; srcset=&quot;/_astro/1.DzpFX8mf_I87xr.webp 640w, /_astro/1.DzpFX8mf_Z1TCS8Y.webp 750w, /_astro/1.DzpFX8mf_1OChcu.webp 828w, /_astro/1.DzpFX8mf_a34mN.webp 1080w, /_astro/1.DzpFX8mf_19VGwF.webp 1280w, /_astro/1.DzpFX8mf_CJ3L8.webp 1668w, /_astro/1.DzpFX8mf_hRMyP.webp 2048w, /_astro/1.DzpFX8mf_Z1gH7z7.webp 2201w&quot; /&gt;&lt;figcaption&gt;Firefly&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🚀 技术架构&lt;a href=&quot;#-技术架构&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;静态站点生成&lt;/strong&gt;: 基于 Astro ，提供极快的加载速度和优秀的 SEO 优化&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;TypeScript 支持&lt;/strong&gt;: 完整的类型安全，提升开发体验和代码质量&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;响应式设计&lt;/strong&gt;: 使用 Tailwind CSS 构建，完美适配桌面端和移动端&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;组件化开发&lt;/strong&gt;: 支持 Astro、Svelte 组件，灵活可扩展&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;📖 配置说明&lt;a href=&quot;#-配置说明&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;blockquote&gt;&lt;p&gt;📚 &lt;strong&gt;详细配置文档&lt;/strong&gt;: 查看 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/&quot; target=&quot;_blank&quot;&gt;Firefly使用文档&lt;/a&gt; 获取完整的配置指南&lt;/p&gt;&lt;/blockquote&gt;&lt;/section&gt;</content:encoded></item><item><title>Firefly 简单使用指南</title><link>https://firefly.cuteleaf.cn/posts/guide/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/guide/</guid><description>如何使用 Firefly 博客模板。</description><pubDate>Fri, 02 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;这个博客模板是基于 &lt;a href=&quot;https://astro.build/&quot; target=&quot;_blank&quot;&gt;Astro&lt;/a&gt; 构建的。对于本指南中未提及的内容，您可以在 &lt;a href=&quot;https://docs.astro.build/&quot; target=&quot;_blank&quot;&gt;Astro 文档&lt;/a&gt; 中找到答案。&lt;/p&gt;
&lt;section&gt;&lt;h2&gt;文章的 Front-matter&lt;a href=&quot;#文章的-front-matter&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;title&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;我的第一篇博客文章&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;published&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;2023-09-09&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;description&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;这是我新 Astro 博客的第一篇文章。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;image&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;./cover.jpg&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;tags&lt;/span&gt;&lt;span&gt;: [&lt;/span&gt;&lt;span&gt;前端&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;开发&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;category&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;前端开发&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;draft&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;false&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
















































































&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;属性&lt;/th&gt;&lt;th&gt;描述&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;title&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章标题。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;published&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章发布日期。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;updated&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章更新日期。如果未设置，将默认使用发布日期。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pinned&lt;/code&gt;&lt;/td&gt;&lt;td&gt;是否将此文章置顶在文章列表顶部。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;description&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章的简短描述。显示在首页上。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;image&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章封面图片路径。&lt;br /&gt;1. 以 &lt;code&gt;http://&lt;/code&gt; 或 &lt;code&gt;https://&lt;/code&gt; 开头：使用网络图片&lt;br /&gt;2. 以 &lt;code&gt;/&lt;/code&gt; 开头：&lt;code&gt;public&lt;/code&gt; 目录中的图片&lt;br /&gt;3. 不带任何前缀：相对于 markdown 文件的路径&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;tags&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章标签。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;category&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章分类。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;lang&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章语言代码（如 &lt;code&gt;zh-CN&lt;/code&gt;）。仅当文章语言与站点默认语言不同时设置。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;licenseName&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章内容的许可证名称。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;licenseUrl&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章内容的许可证链接。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;author&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章作者。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;sourceLink&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章内容的来源链接或参考。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;draft&lt;/code&gt;&lt;/td&gt;&lt;td&gt;如果这篇文章仍是草稿，则不会显示。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;comment&lt;/code&gt;&lt;/td&gt;&lt;td&gt;是否启用此文章的评论功能。默认为 &lt;code&gt;true&lt;/code&gt;。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;slug&lt;/code&gt;&lt;/td&gt;&lt;td&gt;自定义文章 URL 路径。如果不设置，将使用文件名作为 URL。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;password&lt;/code&gt;&lt;/td&gt;&lt;td&gt;文章密码。设置后文章内容将被 AES-256-GCM 加密，访客需输入密码才能查看。&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;passwordHint&lt;/code&gt;&lt;/td&gt;&lt;td&gt;密码提示。显示在密码输入框上方，帮助访客回忆密码，也可以不加。&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;文章文件的放置位置&lt;a href=&quot;#文章文件的放置位置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;您的文章文件应放置在 &lt;code&gt;src/content/posts/&lt;/code&gt; 目录中。您也可以创建子目录来更好地组织您的文章和资源。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;src/content/posts/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;├── post-1.md&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;└── post-2/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;├── cover.png&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;└── index.md&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;自定义文章 URL (Slug)&lt;a href=&quot;#自定义文章-url-slug&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;什么是 Slug？&lt;a href=&quot;#什么是-slug&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Slug 是文章 URL 路径的自定义部分。如果不设置 slug，系统将使用文件名作为 URL。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;Slug 使用示例&lt;a href=&quot;#slug-使用示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;示例 1：使用文件名作为 URL&lt;a href=&quot;#示例-1使用文件名作为-url&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;title&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;我的第一篇博客文章&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;published&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;2023-09-09&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;文件：&lt;code&gt;src/content/posts/my-first-blog-post.md&lt;/code&gt;&lt;/p&gt;&lt;p&gt;URL：&lt;code&gt;/posts/my-first-blog-post&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;示例 2：自定义 Slug&lt;a href=&quot;#示例-2自定义-slug&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;title&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;我的第一篇博客文章&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;published&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;2023-09-09&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;slug&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;hello-world&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;文件：&lt;code&gt;src/content/posts/my-first-blog-post.md&lt;/code&gt;&lt;/p&gt;&lt;p&gt;URL：&lt;code&gt;/posts/hello-world&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;示例 3：其他语言文件名使用Slug&lt;a href=&quot;#示例-3其他语言文件名使用slug&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;title&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;如何使用 Firefly 博客主题&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;published&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;2023-09-09&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;slug&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;how-to-use-firefly-blog-theme&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;文件：&lt;code&gt;src/content/posts/如何使用Firefly博客主题.md&lt;/code&gt;&lt;/p&gt;&lt;p&gt;URL：&lt;code&gt;/posts/how-to-use-firefly-blog-theme&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;Slug 使用建议&lt;a href=&quot;#slug-使用建议&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;使用英文和连字符&lt;/strong&gt;：&lt;code&gt;my-awesome-post&lt;/code&gt; 而不是 &lt;code&gt;my awesome post&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;保持简洁&lt;/strong&gt;：避免过长的 slug&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;具有描述性&lt;/strong&gt;：让 URL 能够反映文章内容&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;避免特殊字符&lt;/strong&gt;：只使用字母、数字和连字符&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;保持一致性&lt;/strong&gt;：在整个博客中使用相似的命名模式&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;注意事项&lt;a href=&quot;#注意事项&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ul&gt;
&lt;li&gt;Slug 一旦设置并发布，建议不要随意更改，以免影响 SEO 和已存在的链接&lt;/li&gt;
&lt;li&gt;如果多个文章使用相同的 slug，后面的文章会覆盖前面的&lt;/li&gt;
&lt;li&gt;Slug 会自动转换为小写&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>Firefly 博客部署教程</title><link>https://firefly.cuteleaf.cn/posts/firefly-%E5%8D%9A%E5%AE%A2%E9%83%A8%E7%BD%B2%E6%95%99%E7%A8%8B/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/firefly-%E5%8D%9A%E5%AE%A2%E9%83%A8%E7%BD%B2%E6%95%99%E7%A8%8B/</guid><pubDate>Sun, 24 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;Firefly 博客部署教程&lt;a href=&quot;#firefly-博客部署教程&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;ul&gt;
&lt;li&gt;根据Firefly 官方文档，涵盖全流程操作，代码可直接复制，小白可按步完成，附关键避坑提示。 &lt;strong&gt;说明&lt;/strong&gt;：基于 Windows 系统；命令可直接执行。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;第一篇：前置准备｜安装必备环境&lt;a href=&quot;#第一篇前置准备安装必备环境&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;一、前言&lt;a href=&quot;#一前言&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 是 Astro 静态博客主题，本文是作者的搭建笔记，为以后回溯搭建过程，为后续操作筑牢基础。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;二、必备软件清单&lt;a href=&quot;#二必备软件清单&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;https://nodejs.org/&quot; target=&quot;_blank&quot;&gt;Node.js&lt;/a&gt;：核心环境，&lt;strong&gt;版本 ≥22&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;pnpm&lt;/li&gt;
&lt;li&gt;Git：用于拉取源码、提交代码&lt;/li&gt;
&lt;li&gt;VS Code：推荐编辑器，用于修改配置、写文章&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;三、分步安装教程&lt;a href=&quot;#三分步安装教程&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;1. 安装 Node.js&lt;a href=&quot;#1-安装-nodejs&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;访问 &lt;a href=&quot;https://nodejs.org/%EF%BC%8C%E4%B8%8B%E8%BD%BD&quot; target=&quot;_blank&quot;&gt;https://nodejs.org/，下载&lt;/a&gt; &lt;strong&gt;LTS 版&lt;/strong&gt;。&lt;/li&gt;
&lt;li&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777551551531_image.png&quot; alt=&quot;image.png|528&quot; /&gt;&lt;figcaption&gt;image.png|528&lt;/figcaption&gt;&lt;/figure&gt;image.png|528&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777551944095_image.png&quot; alt=&quot;image.png|534&quot; /&gt;&lt;figcaption&gt;image.png|534&lt;/figcaption&gt;&lt;/figure&gt;image.png|534&lt;p&gt;&lt;/p&gt;&lt;p&gt;终端执行 &lt;code&gt;node -v&lt;/code&gt;、&lt;code&gt;npm -v&lt;/code&gt;，输出版本号即成功。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777696257686_image.png&quot; alt=&quot;image.png&quot; /&gt;&lt;figcaption&gt;image.png&lt;/figcaption&gt;&lt;/figure&gt;image.png&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;注意&lt;/strong&gt;：安装后重启终端，无效则重启电脑。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2. 安装 pnpm&lt;a href=&quot;#2-安装-pnpm&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;终端执行：&lt;code&gt;npm install -g pnpm&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;执行 &lt;code&gt;pnpm -v&lt;/code&gt; 输出版本号即成功，权限不足用管理员终端。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777696287079_image.png&quot; alt=&quot;image.png&quot; /&gt;&lt;figcaption&gt;image.png&lt;/figcaption&gt;&lt;/figure&gt;image.png&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;注意&lt;/strong&gt;：网络超时切换手机热点。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;3. 安装 Git&lt;a href=&quot;#3-安装-git&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;1.访问 &lt;a href=&quot;https://git-scm.com/download/win%EF%BC%8C%E4%B8%8B%E8%BD%BD%E6%9C%80%E6%96%B0%E7%89%88%E5%B9%B6%E9%BB%98%E8%AE%A4%E5%AE%89%E8%A3%85%E3%80%82&quot; target=&quot;_blank&quot;&gt;https://git-scm.com/download/win，下载最新版并默认安装。&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777696402220_image.png&quot; alt=&quot;image.png&quot; /&gt;&lt;figcaption&gt;image.png&lt;/figcaption&gt;&lt;/figure&gt;image.png&lt;p&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;一直下一步就行了，全程默认安装。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;4. 安装 VS Code（可选）&lt;a href=&quot;#4-安装-vs-code可选&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;1.访问 &lt;a href=&quot;https://code.visualstudio.com/%EF%BC%8C%E4%B8%8B%E8%BD%BD%E5%B9%B6%E5%AE%89%E8%A3%85%EF%BC%8C%E5%8B%BE%E9%80%89%E2%80%9C%E5%88%9B%E5%BB%BA%E6%A1%8C%E9%9D%A2%E5%BF%AB%E6%8D%B7%E6%96%B9%E5%BC%8F%E2%80%9D%E5%92%8C%E2%80%9C%E5%B0%86&quot; target=&quot;_blank&quot;&gt;https://code.visualstudio.com/，下载并安装，勾选“创建桌面快捷方式”和“将&lt;/a&gt; Code 加入 PATH”。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777696460697_image.png&quot; alt=&quot;image.png&quot; /&gt;&lt;figcaption&gt;image.png&lt;/figcaption&gt;&lt;/figure&gt;image.png&lt;p&gt;&lt;/p&gt;&lt;p&gt;推荐安装中文插件。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://tu.fqzlr.com/file/blog/wenzhang/1777696528164_image.png&quot; alt=&quot;image.png&quot; /&gt;&lt;figcaption&gt;image.png&lt;/figcaption&gt;&lt;/figure&gt;image.png&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;四、常见环境问题排查&lt;a href=&quot;#四常见环境问题排查&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;node 命令无效 → 重新安装并勾选“Add to PATH”，重启终端/电脑。&lt;/li&gt;
&lt;li&gt;pnpm 权限不足 → 用管理员终端执行命令。&lt;/li&gt;
&lt;li&gt;git 无反应 → 重启电脑，无效则重装。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;第二篇：源码托管｜Fork Firefly 官方仓库&lt;a href=&quot;#第二篇源码托管fork-firefly-官方仓库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;一、前言&lt;a href=&quot;#一前言-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;通过Fork官方仓库，获得自己的独立仓库，可自由修改内容、同步官方更新，后续推送代码到该仓库，Cloudflare会自动触发构建部署。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;二、前置准备&lt;a href=&quot;#二前置准备&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;已完成第一篇环境安装（Node ≥22、pnpm、Git、VS Code）&lt;/li&gt;
&lt;li&gt;已注册并登录 &lt;a href=&quot;https://fqzlr.com/posts/firefly-set/windows-firefly/%5Bhttps://github.com/&quot; target=&quot;_blank&quot;&gt;&lt;strong&gt;GitHub 账号&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;三、Fork 操作步骤（1分钟完成）&lt;a href=&quot;#三fork-操作步骤1分钟完成&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;打开Firefly官方仓库：&lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;https://github.com/CuteLeaf/Firefly&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;点击页面右上角的「Fork」按钮（绿色/灰色，位置显眼）。&lt;/li&gt;
&lt;li&gt;等待3-5秒，页面自动跳转，此时你已拥有「自己的Firefly仓库」（仓库地址：&lt;a href=&quot;https://github.com/%E4%BD%A0%E7%9A%84GitHub%E7%94%A8%E6%88%B7%E5%90%8D/Firefly%EF%BC%89%E3%80%82&quot; target=&quot;_blank&quot;&gt;https://github.com/你的GitHub用户名/Firefly）。&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;strong&gt;关键说明&lt;/strong&gt;：Fork后的仓库归你所有，修改内容不会影响官方仓库，后续可一键同步官方更新，适合长期维护。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;第三篇：本地搭建｜克隆仓库 + 本地预览调试&lt;a href=&quot;#第三篇本地搭建克隆仓库--本地预览调试&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;一、前言&lt;a href=&quot;#一前言-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;将你Fork后的仓库克隆到本地，安装依赖后启动本地服务，用于预览修改效果（仅本地查看，无需打包，推送代码后Cloudflare自动部署）。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;二、前置准备&lt;a href=&quot;#二前置准备-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;已完成前两篇操作（环境安装、Fork仓库）&lt;/li&gt;
&lt;li&gt;新建空文件夹：路径&lt;strong&gt;无中文、无空格、无特殊字符&lt;/strong&gt;（示例：D:\blog）&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;三、分步操作教程&lt;a href=&quot;#三分步操作教程&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;四、克隆你自己的仓库到本地&lt;a href=&quot;#四克隆你自己的仓库到本地&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;进入 &lt;strong&gt;你的 Fork 仓库&lt;/strong&gt; 页面&lt;/li&gt;
&lt;li&gt;点击 &lt;strong&gt;Code&lt;/strong&gt; → 复制 &lt;strong&gt;HTTPS 地址&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;执行克隆（把地址换成你自己的）： 运行&lt;/li&gt;
&lt;/ol&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git clone https://github.com/你的用户名/Firefly.git&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;ol&gt;
&lt;li&gt;进入项目目录：&lt;/li&gt;
&lt;/ol&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;cd Firefly&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;section&gt;&lt;h3&gt;2. 安装本地依赖（仅用于本地预览）&lt;a href=&quot;#2-安装本地依赖仅用于本地预览&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;安装依赖（用 pnpm） 运行&lt;/li&gt;
&lt;/ol&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;pnpm install&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;3. 启动本地预览服务&lt;a href=&quot;#3-启动本地预览服务&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;pnpm dev&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;ol&gt;
&lt;li&gt;等待10-30秒，终端显示访问地址： &lt;a href=&quot;http://localhost:4321/&quot; target=&quot;_blank&quot;&gt;http://localhost&amp;lt;4321&amp;gt;&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;打开浏览器输入该地址，看到Firefly默认首页，即本地搭建成功。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;4. 本地简单调试&lt;a href=&quot;#4-本地简单调试&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;修改配置 / 文章 → &lt;strong&gt;保存自动刷新&lt;/strong&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;在项目根目录创建&lt;code&gt;wrangler.toml&lt;/code&gt;： Cloudflare Workers部署需要&lt;/li&gt;
&lt;/ol&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;name = &quot;firefly&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;compatibility_date = &quot;YYYY-MM-DD&quot; # 更为今日&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[assets]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;directory = &quot;./dist&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[vars]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;NODE_VERSION = &quot;22&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;2.简单修改站点信息。&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;停止服务：&lt;code&gt;Ctrl + C&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;重新启动：&lt;code&gt;pnpm dev&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;本地仅用于预览，无需执行任何打包命令（Cloudflare会自动打包）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;5. 本地开发完成后&lt;a href=&quot;#5-本地开发完成后&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;1.先配置本地 Git 身份&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;打开电脑的&lt;strong&gt;终端（Mac/Linux）&lt;/strong&gt; 或 &lt;strong&gt;Git Bash/CMD（Windows）&lt;/strong&gt;，执行 2 条命令：&lt;/li&gt;
&lt;/ul&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 1. 设置你的GitHub用户名（就是你GitHub主页的用户名）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --global user.name &quot;你的GitHub用户名&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 2. 设置你的GitHub绑定邮箱（就是你注册GitHub用的邮箱）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --global user.email &quot;你的GitHub邮箱&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;ul&gt;
&lt;li&gt;检测是否成功&lt;/li&gt;
&lt;/ul&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --global user.name&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --global user.email&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;能显示出你填的信息，就说明绑定好了。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;ol&gt;
&lt;li&gt;推送到 GitHub：&lt;/li&gt;
&lt;/ol&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git add .&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git commit -m &quot;更新内容&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;第四篇：部署配置｜Cloudflare 关联GitHub自动构建&lt;a href=&quot;#第四篇部署配置cloudflare-关联github自动构建&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;一、前言&lt;a href=&quot;#一前言-3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;这是核心部署步骤，关联你的GitHub仓库后，后续只要推送代码到GitHub，Cloudflare会自动执行「安装依赖→打包→上线」，全程无需手动操作。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;二、前置准备&lt;a href=&quot;#二前置准备-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;已完成前几篇操作（环境安装、Fork仓库、本地搭建，简单修改，上传到github）&lt;/li&gt;
&lt;li&gt;已注册并登录Cloudflare账号（无账号可注册：&lt;a href=&quot;https://dash.cloudflare.com/%EF%BC%89&quot; target=&quot;_blank&quot;&gt;https://dash.cloudflare.com/）&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;你的GitHub仓库已包含完整Firefly源码&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;三、分步配置教程&lt;a href=&quot;#三分步配置教程&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;1. 新建 Cloudflare Worker 应用&lt;a href=&quot;#1-新建-cloudflare-worker-应用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;登录 Cloudflare 控制台&lt;/strong&gt; 打开浏览器访问官方控制台：&lt;a href=&quot;https://dash.cloudflare.com/%EF%BC%8C%E8%BE%93%E5%85%A5%E8%B4%A6%E5%8F%B7%E5%AF%86%E7%A0%81%E5%AE%8C%E6%88%90%E7%99%BB%E5%BD%95%E3%80%82&quot; target=&quot;_blank&quot;&gt;https://dash.cloudflare.com/，输入账号密码完成登录。&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;进入 Workers &amp;amp; Pages 页面&lt;/strong&gt; 登录后，在左侧菜单栏找到并点击 &lt;strong&gt;Workers 和 Pages&lt;/strong&gt;（英文对应：Workers &amp;amp; Pages），进入应用管理页面。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;创建应用程序&lt;/strong&gt; 在页面右上角，点击 &lt;strong&gt;创建应用程序&lt;/strong&gt;（英文对应：Create application），进入应用创建流程。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;关联 GitHub 代码仓库&lt;/strong&gt; 在创建页面中，选择 &lt;strong&gt;连接到 Git（Connect Git）&lt;/strong&gt;，然后选中 &lt;strong&gt;GitHub&lt;/strong&gt;，按照页面提示完成授权，允许 Cloudflare 访问你的 GitHub 账号。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;选择目标仓库&lt;/strong&gt; 授权完成后，系统会列出你的 GitHub 所有仓库，从中选中需要部署到 Cloudflare Worker 的代码仓库（如 Firefly 仓库）。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;配置构建设置&lt;/strong&gt; ：&lt;/li&gt;
&lt;/ol&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Build command&lt;/strong&gt;: &lt;code&gt;pnpm build&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Deploy command&lt;/strong&gt;: &lt;code&gt;npx wrangler deploy&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;发起首次部署&lt;/strong&gt; 配置完成后，点击页面底部的 &lt;strong&gt;部署（Deploy）&lt;/strong&gt;，启动首次自动部署流程。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;等待自动构建完成&lt;/strong&gt; Cloudflare 会自动执行三个操作：拉取 GitHub 仓库代码 → 执行构建命令 → 将项目部署至 Workers 服务器，耐心等待即可。。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2. 验证自动部署是否成功&lt;a href=&quot;#2-验证自动部署是否成功&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;当构建状态显示“成功”后，点击 Worker 项目顶部的 &lt;strong&gt;临时域名&lt;/strong&gt;（格式为：&lt;code&gt;xxx.workers.dev&lt;/code&gt;）。&lt;/li&gt;
&lt;li&gt;打开浏览器访问该临时域名，若页面展示效果与本地预览的博客首页完全一致，说明 Cloudflare Worker 与 GitHub 自动部署配置成功。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;第五篇：绑定域名（Spaceship 平台域名适配）&lt;a href=&quot;#第五篇绑定域名spaceship-平台域名适配&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;完成 Cloudflare Worker 自动部署后，默认使用 &lt;code&gt;xxx.workers.dev&lt;/code&gt; 临时域名访问，为了提升专业性和记忆性，我们将你在 &lt;a href=&quot;https://www.spaceship.com/zh/auth/?returnUrl=/launchpad/&quot; target=&quot;_blank&quot;&gt;Spaceship 平台&lt;/a&gt; 注册的域名，绑定到 Worker 应用，全程适配博客框架，步骤清晰无冗余。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;一、绑定前准备（必做）&lt;a href=&quot;#一绑定前准备必做&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;确认域名状态&lt;/strong&gt;：登录 &lt;a href=&quot;https://www.spaceship.com/zh/auth/?returnUrl=/launchpad/&quot; target=&quot;_blank&quot;&gt;Spaceship 控制台&lt;/a&gt;，确认你的域名状态为“正常”，未被锁定、未过期，且已完成实名认证（若有要求），避免因域名异常导致绑定失败。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;二、Step 1：在 Cloudflare 中添加自定义域名&lt;a href=&quot;#二step-1在-cloudflare-中添加自定义域名&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;登录 Cloudflare 控制台，进入之前创建的 Worker 项目主页（可通过左侧「Workers 和 Pages」找到对应项目）。&lt;/li&gt;
&lt;li&gt;在项目主页左侧导航栏，点击 &lt;strong&gt;触发器&lt;/strong&gt;（英文：Triggers）选项卡，找到「自定义域」模块，点击 &lt;strong&gt;添加自定义域&lt;/strong&gt;。&lt;/li&gt;
&lt;li&gt;在弹出的输入框中，填写你在 Spaceship 平台的域名（如 &lt;code&gt;yourdomain.com&lt;/code&gt; 或 &lt;code&gt;www.yourdomain.com&lt;/code&gt;），点击 &lt;strong&gt;添加&lt;/strong&gt;。&lt;/li&gt;
&lt;li&gt;添加后，Cloudflare 会自动生成对应的 DNS 解析记录（CNAME 记录），记录下该 CNAME 记录的「目标值」（通常为你的 Worker 临时域名），后续需在 Spaceship 平台配置该解析。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;三、Step 2：在 Spaceship 平台配置 DNS 解析（核心步骤）&lt;a href=&quot;#三step-2在-spaceship-平台配置-dns-解析核心步骤&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;这一步是关键，需在你的域名所在平台（Spaceship）修改 DNS 解析，将域名指向 Cloudflare Worker，具体操作如下：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;登录 Spaceship 控制台&lt;/strong&gt;：打开浏览器，访问 &lt;a href=&quot;https://www.spaceship.com/zh/auth/?returnUrl=/launchpad/&quot; target=&quot;_blank&quot;&gt;https://www.spaceship.com/zh/auth/?returnUrl=%2Flaunchpad%2F&lt;/a&gt;，输入你的账号密码完成登录（若已登录可直接进入）。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;进入域名管理页面&lt;/strong&gt;：登录后，点击顶部「Launchpad」（控制台），找到「Domain Manager」（域名管理）模块，在域名列表中找到你要绑定的域名，点击该域名进入详情页。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;进入 DNS 解析设置&lt;/strong&gt;：在域名详情页中，找到「DNS」选项（或「DNS 解析」「解析设置」），点击进入 DNS 解析配置页面，删除当前无关的解析记录（避免冲突）。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;添加 CNAME 解析记录&lt;/strong&gt;：点击「添加记录」（或「新增解析」），按以下参数填写（适配 Cloudflare Worker 绑定）：
&lt;ol&gt;
&lt;li&gt;记录类型：选择 &lt;strong&gt;CNAME&lt;/strong&gt;（核心类型，用于将域名指向 Worker 临时域名，适配 IP 动态变化场景）；&lt;/li&gt;
&lt;li&gt;主机记录：填写 &lt;code&gt;@&lt;/code&gt;（代表主域名，如 &lt;code&gt;yourdomain.com&lt;/code&gt;）或 &lt;code&gt;www&lt;/code&gt;（代表带 www 前缀的域名，如 &lt;code&gt;www.yourdomain.com&lt;/code&gt;，建议两者都添加）；&lt;/li&gt;
&lt;li&gt;记录值：粘贴 Step 1 中 Cloudflare 生成的 CNAME 目标值（即 Worker 临时域名，如&lt;code&gt;xxx.workers.dev&lt;/code&gt;），确保填写无误；&lt;/li&gt;
&lt;li&gt;TTL（缓存时间）：设置为 10~60 分钟（数值越小，解析生效越快，新手可直接默认）；&lt;/li&gt;
&lt;/ol&gt;
&lt;/li&gt;
&lt;li&gt;点击「保存」，完成 DNS 解析配置，此时 Spaceship 平台的域名解析已指向 Cloudflare Worker。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;四、Step 4：验证域名绑定是否成功&lt;a href=&quot;#四step-4验证域名绑定是否成功&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;DNS 解析生效时间通常为 10 分钟~24 小时（新域名生效较快，老域名可能需等待更久），可通过以下两种方式验证绑定结果：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;浏览器直接访问&lt;/strong&gt;：打开浏览器，输入你绑定的域名（如 &lt;code&gt;yourdomain.com&lt;/code&gt;），若能正常显示博客首页，且地址栏有 HTTPS 小锁标志，说明绑定成功；若提示“无法访问”，请耐心等待解析生效，或检查解析记录填写是否正确。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;在线工具查询&lt;/strong&gt;：使用 DNS 解析查询工具（如 DNSChecker.org），输入你的域名，查询 CNAME 记录，若查询结果与你配置的 Worker 临时域名一致，说明解析已生效，绑定成功。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;###五、域名绑定常见问题排查&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;解析配置后无法访问&lt;/strong&gt;：检查 Spaceship 平台的 CNAME 记录值是否与 Cloudflare 生成的目标值一致，TTL 设置是否过小，若无误，耐心等待解析生效（最长 24 小时）；同时确认 Cloudflare 中自定义域已添加成功。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;浏览器提示“不安全”&lt;/strong&gt;：检查 Cloudflare 的 SSL/TLS 加密模式是否设置正确，证书是否已生效，若未生效，等待几分钟后刷新页面重试。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;提示“域名已被占用”&lt;/strong&gt;：确认该域名未被其他 Cloudflare 项目绑定，若已绑定，先删除原有绑定，再重新添加。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;DNS 解析修改无效&lt;/strong&gt;：检查 Spaceship 平台的域名 DNS 服务器是否为默认服务器，若已修改为第三方 DNS，需先改回默认或同步解析记录至对应 DNS 服务器。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>butterfly安装rss插件</title><link>https://firefly.cuteleaf.cn/posts/butterfly%E5%AE%89%E8%A3%85rss%E6%8F%92%E4%BB%B6/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/butterfly%E5%AE%89%E8%A3%85rss%E6%8F%92%E4%BB%B6/</guid><pubDate>Sun, 17 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h3&gt;一、引言&lt;a href=&quot;#一引言&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;由于我用的是butterfly主题，而在我写文章之前，主题文档内并没有和RSS订阅有关的教程，不过我在寻找各大搜索引擎时发现了这么一个插件，用的人也挺多。我也是打算写一篇文章记录一下我在hexo第一次折腾的事迹哈哈&lt;/p&gt;&lt;/section&gt;
&lt;section&gt;&lt;h3&gt;二、安装rss插件并在主题中设置&lt;a href=&quot;#二安装rss插件并在主题中设置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;在butterfly的插件推荐中有说明了hexo的rss插件，叫hexo-generator-feed&lt;/p&gt;&lt;p&gt;首先添加插件，这里使用的是npm添加
npm install hexo-generator-feed —save
然后在根目录中的_config.yml中添加如下配置&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;feed&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;enable&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;type&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;atom&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;path&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;atom.xml&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;limit&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;20&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;官网还说明了一些其他的参数，如：&lt;/p&gt;&lt;p&gt;enable: 默认开启可以省略
type: RSS的类型(atom/rss2)
path: 文件路径，默认是 atom.xml/rss2.xml
limit: 展示文章的数量,使用 0 或则 false 代表展示全部
hub: 如果使用不到可以为空
content: （可选）设置 true 可以在 RSS 文件中包含文章全部内容，默认：false
content_limit: （可选）摘要中使用的帖子内容的默认长度。 仅在内容设置为false且未显示自定义帖子描述时才使用。
content_limit_delim :（可选）如果content_limit用于缩短帖子内容，则仅在达到字符限制之前在此分隔符的最后一次出现处剪切。默认不使用。
icon: (可选）自定义图标。默认为主配置中指定的电子邮件头像。
autodiscovery: 添加提要自动发现，默认开启
template : 自定义模板路径。该文件用于生成 xml 文件
然后去主题的_config.yml中添加配置&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;rss&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;/atom.xml&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;这样你在用hexo g生成静态网页的时候会在public文件夹中（也就是你静态网页文件夹中）生成一个atom.xml文件&lt;/p&gt;&lt;p&gt;（可选）如果你想让别人知道你的RSS链接，可以在主题中的social settings中添加如下配置（就是在那侧边栏个人资料下面添加一个图标并链接到你的RSS文件）&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;fas fa-rss&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;/atom.xml&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;因为butterfly主题中有自带的fas图标，所以直接可以使用&lt;/p&gt;&lt;/section&gt;</content:encoded></item><item><title>Cloudflare Pages 部署免费图床</title><link>https://firefly.cuteleaf.cn/posts/cloudflare-pages-%E9%83%A8%E7%BD%B2%E5%85%8D%E8%B4%B9%E5%9B%BE%E5%BA%8A/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/cloudflare-pages-%E9%83%A8%E7%BD%B2%E5%85%8D%E8%B4%B9%E5%9B%BE%E5%BA%8A/</guid><pubDate>Sun, 17 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;Cloudflare Pages 部署&lt;a href=&quot;#cloudflare-pages-部署&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;Cloudflare Pages 是推荐的部署方式，提供免费托管、全球 CDN 加速和无需服务器维护的优势。&lt;/p&gt;&lt;section&gt;&lt;h2&gt;📂 第一步：Fork 项目&lt;a href=&quot;#-第一步fork-项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;访问 &lt;a href=&quot;https://github.com/MarSeventh/CloudFlare-ImgBed&quot; target=&quot;_blank&quot;&gt;CloudFlare ImgBed 项目&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;点击右上角的 “Fork” 按钮&lt;/li&gt;
&lt;li&gt;选择您的 GitHub 账户&lt;/li&gt;
&lt;li&gt;确认 Fork 完成&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🏗️ 第二步：创建 Pages 项目&lt;a href=&quot;#️-第二步创建-pages-项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;2.1 访问 Cloudflare Dashboard&lt;a href=&quot;#21-访问-cloudflare-dashboard&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;登录 &lt;a href=&quot;https://dash.cloudflare.com/&quot; target=&quot;_blank&quot;&gt;Cloudflare Dashboard&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;选择左侧菜单的 “计算和AI” -&amp;gt; “Workers &amp;amp; Pages”&lt;/li&gt;
&lt;li&gt;点击 “创建应用程序”&lt;/li&gt;
&lt;li&gt;在最下方 &lt;code&gt;Looking to deploy Pages? &lt;/code&gt;选择 “Get started”&lt;/li&gt;
&lt;li&gt;在 “导入现有 Git 存储库” 处点击 “开始使用”&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/pages-create.png&quot; alt=&quot;创建 Pages 项目&quot; /&gt;&lt;figcaption&gt;创建 Pages 项目&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/pages-create-1.png&quot; alt=&quot;创建 Pages 项目&quot; /&gt;&lt;figcaption&gt;创建 Pages 项目&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.2 连接 GitHub 仓库&lt;a href=&quot;#22-连接-github-仓库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;如果首次使用，需要授权 Cloudflare 访问 GitHub&lt;/li&gt;
&lt;li&gt;选择您 Fork 的 &lt;code&gt;CloudFlare-ImgBed&lt;/code&gt; 仓库&lt;/li&gt;
&lt;li&gt;点击 “开始设置”&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.3 配置项目设置&lt;a href=&quot;#23-配置项目设置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;





























&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;配置项&lt;/th&gt;&lt;th&gt;值&lt;/th&gt;&lt;th&gt;说明&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;项目名称&lt;/td&gt;&lt;td&gt;&lt;code&gt;cloudflare-imgbed&lt;/code&gt;（或自定义）&lt;/td&gt;&lt;td&gt;项目标识符&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;生产分支&lt;/td&gt;&lt;td&gt;&lt;code&gt;main&lt;/code&gt;&lt;/td&gt;&lt;td&gt;生产环境分支&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;构建命令&lt;/td&gt;&lt;td&gt;&lt;code&gt;npm install&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;strong&gt;重要：v2.0 新构建命令&lt;/strong&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;构建输出目录&lt;/td&gt;&lt;td&gt;&lt;code&gt;/frontend-dist&lt;/code&gt;&lt;/td&gt;&lt;td&gt;前端构建产物目录&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/pages-build-config.png&quot; alt=&quot;配置项目设置&quot; /&gt;&lt;figcaption&gt;配置项目设置&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;重要提醒&lt;/p&gt;&lt;p&gt;v2.0 版本的构建命令已变更为 &lt;code&gt;npm install&lt;/code&gt;，请确保使用正确的构建命令。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.4 部署项目&lt;a href=&quot;#24-部署项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;点击 “保存并部署”&lt;/li&gt;
&lt;li&gt;等待首次部署完成（约 2-3 分钟）&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🗄️ 第三步：配置数据库&lt;a href=&quot;#️-第三步配置数据库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;数据库用于存储文件元数据，是必需的组件，可选数据库为 &lt;code&gt;KV&lt;/code&gt; 数据库和 &lt;code&gt;D1&lt;/code&gt; 数据库。两者对比如下表所示，根据自己使用场景&lt;strong&gt;从其中选择一种配置即可&lt;/strong&gt;。&lt;/p&gt;



















&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;特点&lt;/th&gt;&lt;th&gt;KV 数据库&lt;/th&gt;&lt;th&gt;D1 数据库&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;读写性能&lt;/td&gt;&lt;td&gt;高&lt;/td&gt;&lt;td&gt;较低&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;免费额度&lt;/td&gt;&lt;td&gt;少&lt;/td&gt;&lt;td&gt;多&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;重要提示&lt;/p&gt;&lt;p&gt;KV 数据库和 D1 数据库&lt;strong&gt;只需要配置其中一个&lt;/strong&gt;即可，不需要同时配置两个！建议根据上表选择适合自己的数据库类型。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;3.1 KV 数据库配置&lt;a href=&quot;#31-kv-数据库配置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;创建 KV 命名空间&lt;a href=&quot;#创建-kv-命名空间&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ol&gt;
&lt;li&gt;在 Cloudflare Dashboard 中选择 “存储和数据库”&lt;/li&gt;
&lt;li&gt;点击 “Workers KV”&lt;/li&gt;
&lt;li&gt;点击 “创建实例”&lt;/li&gt;
&lt;li&gt;输入命名空间名称：&lt;code&gt;img_url&lt;/code&gt;（建议使用此名称）&lt;/li&gt;
&lt;li&gt;点击 “创建”&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/kv-create.png&quot; alt=&quot;创建 KV 命名空间&quot; /&gt;&lt;figcaption&gt;创建 KV 命名空间&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/kv-create-1.png&quot; alt=&quot;创建 KV 命名空间&quot; /&gt;&lt;figcaption&gt;创建 KV 命名空间&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;绑定 KV 到项目&lt;a href=&quot;#绑定-kv-到项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ol&gt;
&lt;li&gt;返回您的 Pages 项目&lt;/li&gt;
&lt;li&gt;选择 “设置” → “绑定”&lt;/li&gt;
&lt;li&gt;点击 “添加” → “KV 命名空间”&lt;/li&gt;
&lt;li&gt;填写绑定信息：
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;变量名称&lt;/strong&gt;：&lt;code&gt;img_url&lt;/code&gt;（必须是这个名称）&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;KV 命名空间&lt;/strong&gt;：选择刚创建的命名空间&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;点击 “保存”&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;注意&lt;/p&gt;&lt;p&gt;绑定 KV 时，变量名称必须为 &lt;code&gt;img_url&lt;/code&gt;，这是项目预设的变量名，填错会出现无法进入管理界面等情况。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;3.2 D1 数据库配置&lt;a href=&quot;#32-d1-数据库配置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;创建 D1 数据库&lt;a href=&quot;#创建-d1-数据库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ol&gt;
&lt;li&gt;在 Cloudflare Dashboard 中选择 “存储和数据库”&lt;/li&gt;
&lt;li&gt;点击 “D1 SQL 数据库”&lt;/li&gt;
&lt;li&gt;点击 “创建数据库”&lt;/li&gt;
&lt;li&gt;输入数据库名称：&lt;code&gt;img_d1&lt;/code&gt;（建议使用此名称）&lt;/li&gt;
&lt;li&gt;点击 “创建”&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;初始化 D1 数据库&lt;a href=&quot;#初始化-d1-数据库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ol&gt;
&lt;li&gt;创建完成后，点击进入数据库详情页&lt;/li&gt;
&lt;li&gt;选择 “控制台” 选项卡&lt;/li&gt;
&lt;li&gt;在 SQL 输入框中粘贴并执行注释区域以下的内容（见&lt;a href=&quot;https://github.com/MarSeventh/CloudFlare-ImgBed/blob/main/database/init.sql&quot; target=&quot;_blank&quot;&gt;项目仓库&lt;/a&gt;）&lt;/li&gt;
&lt;li&gt;点击 “执行”&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;绑定 D1 到项目&lt;a href=&quot;#绑定-d1-到项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ol&gt;
&lt;li&gt;返回您的 Pages 项目&lt;/li&gt;
&lt;li&gt;选择 “设置” → “绑定”&lt;/li&gt;
&lt;li&gt;点击 “添加” → “D1 数据库”&lt;/li&gt;
&lt;li&gt;填写绑定信息：
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;变量名称&lt;/strong&gt;：&lt;code&gt;img_d1&lt;/code&gt;（必须是这个名称）&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;D1 数据库&lt;/strong&gt;：选择刚创建的数据库&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;点击 “保存”&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🔄 第四步：重新部署&lt;a href=&quot;#-第四步重新部署&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;绑定数据库后需要重新部署以生效：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;进入项目的 “部署” 页面&lt;/li&gt;
&lt;li&gt;找到最新的部署记录&lt;/li&gt;
&lt;li&gt;点击右侧的 ”…” 菜单&lt;/li&gt;
&lt;li&gt;选择 “重试部署”&lt;/li&gt;
&lt;li&gt;等待部署完成&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/redeploy.png&quot; alt=&quot;重新部署&quot; /&gt;&lt;figcaption&gt;重新部署&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🚀 下一步&lt;a href=&quot;#-下一步&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;至此已经完成项目在 Cloudflare Pages 的部署，但是尚未添加存储渠道，添加存储渠道和进行其他设置的方式请参考&lt;/p&gt;&lt;section&gt;&lt;h3&gt;配置 R2 渠道&lt;a href=&quot;#配置-r2-渠道&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;服务器部署时默认添加了 Cloudflare R2 存储方式，以下步骤仅针对 Cloudflare 部署方式：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;在项目设置中绑定 R2 存储桶：
&lt;ul&gt;
&lt;li&gt;选择 “设置” → “绑定”&lt;/li&gt;
&lt;li&gt;添加 “R2 存储桶”&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;变量名称&lt;/strong&gt;：&lt;code&gt;img_r2&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;R2 存储桶&lt;/strong&gt;：选择已创建的存储桶&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/r2-config.png&quot; alt=&quot;配置 R2 渠道&quot; /&gt;&lt;figcaption&gt;配置 R2 渠道&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;在管理后台配置：
&lt;ul&gt;
&lt;li&gt;进入 “系统设置” → “上传设置”&lt;/li&gt;
&lt;li&gt;配置 R2 渠道参数&lt;/li&gt;
&lt;li&gt;如需图像审查，填入 R2 公开访问链接&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;提示&lt;/p&gt;&lt;p&gt;请注意Cloudflare R2 的免费额度限制，超过后可能会产生费用。 &lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://cfbed.sanyue.de/images/deployment/r2-free-tier.png&quot; alt=&quot;注意&quot; /&gt;&lt;figcaption&gt;注意&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>增加discuss评论</title><link>https://firefly.cuteleaf.cn/posts/discuss/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/discuss/</guid><pubDate>Sun, 17 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;VitePress 集成 Giscus 评论插件&lt;a href=&quot;#vitepress-集成-giscus-评论插件&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;前言&lt;a href=&quot;#前言&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;笔者维护的 &lt;a href=&quot;https://theme.sugarat.top/&quot; target=&quot;_blank&quot;&gt;VitePress 博客主题&lt;/a&gt; 已经集成了非常多的功能，为便于在主题之外复用，因此有计划将其一部分功能分离出来，形成独立的插件。&lt;/p&gt;&lt;p&gt;分离的 &lt;a href=&quot;https://www.npmjs.com/package/vitepress-plugin-giscus&quot; target=&quot;_blank&quot;&gt;Giscus 评论插件&lt;/a&gt;，效果如下：&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;https://github.com/ATQQ/sugar-blog/blob/master/packages/vitepress-plugin-giscus/image.png?raw=true&quot; alt=&quot;&quot; /&gt;&lt;/p&gt;&lt;p&gt;不仅集成了 Giscus 评论系统，还包含了一个悬浮的评论跳转按钮（带移动端适配）。&lt;/p&gt;&lt;p&gt;接下来先简单介绍一下用法，再快速讲解核心原理。&lt;/p&gt;&lt;p&gt;插件开发基于之前创建的一个通用模板，&lt;a href=&quot;https://github.com/ATQQ/sugar-blog/tree/master/template/vitepress-plugin-slot-inject-template&quot; target=&quot;_blank&quot;&gt;vitepress-plugin-slot-inject-template&lt;/a&gt;，在模板的基础上，&lt;strong&gt;插件95%的代码由 Gemini 3.0 生成。&lt;/strong&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;关于 Giscus&lt;a href=&quot;#关于-giscus&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a href=&quot;https://giscus.app/zh-CN&quot; target=&quot;_blank&quot;&gt;Giscus&lt;/a&gt; 是一个基于 GitHub Discussions 的评论系统。它开源、免费、无广告、无跟踪，并且支持多种语言。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;配置参数获取方式：&lt;/strong&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;访问 &lt;a href=&quot;https://giscus.app/zh-CN&quot; target=&quot;_blank&quot;&gt;Giscus 官网&lt;/a&gt;。&lt;/li&gt;
&lt;li&gt;按照页面提示配置你的仓库信息（确保仓库是公开的，并且安装了 Giscus App，且开启了 Discussions 功能）。&lt;/li&gt;
&lt;li&gt;在页面底部的“启用 giscus”部分，你会看到生成的一段 &lt;code&gt;&amp;lt;script&amp;gt;&lt;/code&gt; 代码。&lt;/li&gt;
&lt;li&gt;将代码中的 &lt;code&gt;data-repo&lt;/code&gt;、&lt;code&gt;data-repo-id&lt;/code&gt;、&lt;code&gt;data-category&lt;/code&gt;、&lt;code&gt;data-category-id&lt;/code&gt; 等属性值对应填入插件配置即可。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;如何使用&lt;a href=&quot;#如何使用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;em&gt;只需要 2 步：&lt;/em&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;安装插件&lt;/li&gt;
&lt;/ol&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;pnpm add vitepress-plugin-giscus @giscus/vue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;1&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;配置插件&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;在 &lt;code&gt;.vitepress/config.ts&lt;/code&gt; 中引入插件：&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;import { defineConfig } from &apos;vitepress&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;import { giscusPlugin } from &apos;vitepress-plugin-giscus&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export default defineConfig({&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;vite: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;plugins: [&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;      &lt;/span&gt;&lt;/span&gt;&lt;span&gt;giscusPlugin({&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;repo: &apos;your-github-username/your-repo-name&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;repoId: &apos;your-repo-id&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;category: &apos;Announcements&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;categoryId: &apos;your-category-id&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;mapping: &apos;pathname&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;// ...其他 giscus 配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;      &lt;/span&gt;&lt;/span&gt;&lt;span&gt;})&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;})&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>pushoo.js 让twikoo推送消息到指定app</title><link>https://firefly.cuteleaf.cn/posts/pushoojs-%E8%AE%A9twikoo%E6%8E%A8%E9%80%81%E6%B6%88%E6%81%AF%E5%88%B0%E6%8C%87%E5%AE%9Aapp/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/pushoojs-%E8%AE%A9twikoo%E6%8E%A8%E9%80%81%E6%B6%88%E6%81%AF%E5%88%B0%E6%8C%87%E5%AE%9Aapp/</guid><pubDate>Sun, 17 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;pushoo.js 让twikoo推送消息到指定app&lt;a href=&quot;#pushoojs-让twikoo推送消息到指定app&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;背景&lt;a href=&quot;#背景&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;消息推送平台多用于在特定的场合提醒使用者，例如：博客收到评论、服务器告警、油价上涨、每日签到结果推送、家中饲养的鸽子外出、飞回，等等……自从方糖气球推出 Server 酱以来，消息推送平台逐渐多样化，他们遵循的 API 格式却很混乱。&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;有的是 URL 地址传参，有的是 form 表单传参，有的是 JSON 传参，暂时还没看到 XML 传参的；&lt;/li&gt;
&lt;li&gt;有的正文支持 Markdown，有的正文支持 HTML，有的正文支持纯文本；&lt;/li&gt;
&lt;li&gt;有的支持标题，有的不支持标题。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;Twikoo 评论系统对不同的消息推送平台做了大量的适配工作，云函数越来越大。&lt;/p&gt;&lt;p&gt;为了降低云函数复杂度，遂诞生了本项目，本项目旨在整合各大消息推送平台服务，获得统一的调用体验。&lt;/p&gt;&lt;p&gt;同时本项目由Tianli0提供公益QQ机器人推送服务，请勿用于非法用途！（机器人QQ将不定期更换，请关注文档）&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;支持的消息推送平台&lt;a href=&quot;#支持的消息推送平台&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;Webhook&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://qmsg.zendee.cn/&quot; target=&quot;_blank&quot;&gt;Qmsg&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://sct.ftqq.com/r/13235&quot; target=&quot;_blank&quot;&gt;Server 酱&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://www.pushplus.plus/&quot; target=&quot;_blank&quot;&gt;Push Plus&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://pushplus.hxtrip.com/&quot; target=&quot;_blank&quot;&gt;Push Plus Hxtrip&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://open.dingtalk.com/document/group/custom-robot-access&quot; target=&quot;_blank&quot;&gt;钉钉&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://guole.fun/posts/626/&quot; target=&quot;_blank&quot;&gt;企业微信&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://developer.work.weixin.qq.com/document/path/91770&quot; target=&quot;_blank&quot;&gt;企业微信群机器人&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://github.com/Finb/Bark&quot; target=&quot;_blank&quot;&gt;Bark&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://docs.go-cqhttp.org/api/&quot; target=&quot;_blank&quot;&gt;go-cqhttp&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://blog.tianli0.top/&quot; target=&quot;_blank&quot;&gt;atri&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://www.pushdeer.com/&quot; target=&quot;_blank&quot;&gt;PushDeer&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://push.hellyw.com/&quot; target=&quot;_blank&quot;&gt;iGot&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://core.telegram.org/bots&quot; target=&quot;_blank&quot;&gt;Telegram&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://www.feishu.cn/hc/zh-CN/articles/360024984973&quot; target=&quot;_blank&quot;&gt;飞书&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://ifttt.com/maker_webhooks&quot; target=&quot;_blank&quot;&gt;IFTTT&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://discord.com/developers/docs/resources/webhook#execute-webhook&quot; target=&quot;_blank&quot;&gt;Discord&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://wxpusher.zjiecode.com/docs/#/&quot; target=&quot;_blank&quot;&gt;WxPusher&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://joaoapps.com/join/&quot; target=&quot;_blank&quot;&gt;Join&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;计划支持的推送平台&lt;a href=&quot;#计划支持的推送平台&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;阿里云短信&lt;/li&gt;
&lt;li&gt;腾讯云短信&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;使用方法&lt;a href=&quot;#使用方法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;注：如果您是在 Twikoo 评论系统中使用，则无需搭建，直接在 Twikoo 管理面板中配置平台名称和 token 即可。&lt;/p&gt;&lt;p&gt;如果您是在 GitHub Actions 中使用，可以使用 &lt;a href=&quot;https://github.com/funnyzak/pushoo-action&quot; target=&quot;_blank&quot;&gt;funnyzak/pushoo-action&lt;/a&gt;，该作者还提供了基于 pushoo 的命令行工具：&lt;a href=&quot;https://github.com/funnyzak/pushoo-cli&quot; target=&quot;_blank&quot;&gt;funnyzak/pushoo-cli&lt;/a&gt;。&lt;/p&gt;&lt;p&gt;安装&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npm install pushoo&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;现在，不论您使用什么推送平台，都无需关心他们的调用方式，只需要学习 pushoo 的调用方式即可开始发送您的第一条推送！&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;const pushoo = require(&apos;pushoo&apos;).default;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;const result = await pushoo(&apos;平台名称&apos;, {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;token: &apos;平台用户身份标识&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;title: &apos;消息标题&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;content: &apos;Markdown 格式的推送内容&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;});&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;console.log(result);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;是的，调用 pushoo 最简单只需要传递 4 个参数！&lt;/p&gt;








































&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;参数&lt;/th&gt;&lt;th&gt;必填&lt;/th&gt;&lt;th&gt;默认&lt;/th&gt;&lt;th&gt;说明&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;平台名称&lt;/td&gt;&lt;td&gt;✅&lt;/td&gt;&lt;td&gt;无&lt;/td&gt;&lt;td&gt;字符串，平台名称的缩写，支持：&lt;code&gt;webhook&lt;/code&gt;、&lt;code&gt;qmsg&lt;/code&gt;、&lt;code&gt;serverchan&lt;/code&gt;、&lt;code&gt;pushplus&lt;/code&gt;、&lt;code&gt;pushplushxtrip&lt;/code&gt;、&lt;code&gt;dingtalk&lt;/code&gt;、&lt;code&gt;wecom&lt;/code&gt;、&lt;code&gt;bark&lt;/code&gt;、&lt;code&gt;gocqhttp&lt;/code&gt;、&lt;code&gt;atri&lt;/code&gt;、&lt;code&gt;pushdeer&lt;/code&gt;、&lt;code&gt;igot&lt;/code&gt;、&lt;code&gt;telegram&lt;/code&gt;、&lt;code&gt;feishu&lt;/code&gt;、&lt;code&gt;ifttt&lt;/code&gt;、&lt;code&gt;wecombot&lt;/code&gt;、&lt;code&gt;discord&lt;/code&gt;, &lt;code&gt;wxpusher&lt;/code&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;token&lt;/td&gt;&lt;td&gt;✅&lt;/td&gt;&lt;td&gt;无&lt;/td&gt;&lt;td&gt;平台用户身份标识，通常情况下是一串数字和字母组合，详情和示例见下方详细说明&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;title&lt;/td&gt;&lt;td&gt;&lt;/td&gt;&lt;td&gt;内容第一行&lt;/td&gt;&lt;td&gt;可选，消息标题，如果推送平台不支持消息标题，则会拼接在正文首行&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;content&lt;/td&gt;&lt;td&gt;✅&lt;/td&gt;&lt;td&gt;无&lt;/td&gt;&lt;td&gt;Markdown 格式的推送内容，如果推送平台不支持 Markdown，pushoo 会自动转换成支持的格式&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;options&lt;/td&gt;&lt;td&gt;❌&lt;/td&gt;&lt;td&gt;无&lt;/td&gt;&lt;td&gt;用于推送时的一些额外配置。类型&lt;code&gt;NoticeOptions&lt;/code&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;interface NoticeOptions {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* webhook通知方式的参数配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;webhook?: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* url 发送通知的地址&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;url: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* method 请求方法，默认为 POST&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;method?: &apos;GET&apos; | &apos;POST&apos;;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* bark通知方式的参数配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;bark?: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* url 用于点击通知后跳转的地址&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;url?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* IFTTT通知方式的参数配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;ifttt?: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;value1?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;value2?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;30&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;value3?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;31&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;32&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;33&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* Discord通知方式的参数配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;34&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;35&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;discord?: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;36&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;userName?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;37&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;avatarUrl?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;38&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;39&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;40&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* WxPusher通知方式的参数配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;41&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;   &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;42&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;wxpusher?: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;43&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;uids?: string[];&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;44&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;url?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;45&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;verifyPay?: boolean;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;46&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;47&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;dingtalk?: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;48&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;/**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;49&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* 消息类型，目前支持 text、markdown。不设置，默认为 text。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;50&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;     &lt;/span&gt;&lt;/span&gt;&lt;span&gt;*/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;51&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;msgtype?: string;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;52&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;53&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;详细说明&lt;a href=&quot;#详细说明&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;💬 Webhook 缩写: &lt;code&gt;webhook&lt;/code&gt;&lt;a href=&quot;#-webhook-缩写-webhook&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Webhook 是一种用户定义的 HTTP 回调，通常用于将实时数据推送到指定的 URL。pushoo 可以通过 Webhook 方式将消息推送到你自定义的后端。&lt;/p&gt;&lt;p&gt;示例调用：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;let respond = await pushoo(&apos;webhook&apos;, {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;token: &apos;&apos;, // 可选，暂不支持签名&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;title: &apos;&apos;, // 可选&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;content: &apos;推送内容&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;options: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;webhook: {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;      &lt;/span&gt;&lt;/span&gt;&lt;span&gt;url: &apos;https://example.com/webhook-endpoint&apos;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;      &lt;/span&gt;&lt;/span&gt;&lt;span&gt;method: &apos;POST&apos; // 可选，默认为 POST，也可以设置为 GET&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;});&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;特别地，为兼容 Twikoo 中现有的使用方式，可以直接把平台名称设置为 Webhook 的 URL 地址（以 &lt;code&gt;http://&lt;/code&gt; 或 &lt;code&gt;https://&lt;/code&gt; 开头），无需传入 &lt;code&gt;options&lt;/code&gt;。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;let respond = await pushoo(&apos;https://example.com/webhook-endpoint&apos;, {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;token: &apos;&apos;, // 可选&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;title: &apos;&apos;, // 可选&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;content: &apos;推送内容&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;});&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;此时如果 URL 的末尾为 &lt;code&gt;:GET&lt;/code&gt; 则使用 GET 方法发送请求（实际 URL 自动去掉 &lt;code&gt;:GET&lt;/code&gt;），否则默认使用 POST 方法发送请求。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://qmsg.zendee.cn/&quot; target=&quot;_blank&quot;&gt;Qmsg&lt;/a&gt; 缩写: &lt;code&gt;qmsg&lt;/code&gt;&lt;a href=&quot;#-qmsg-缩写-qmsg&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Qmsg 酱是 Zendee 提供的第三方 QQ 消息推送服务，免费，消息以 QQ 消息的形式推送，支持私聊推送和群推送。请注意，为避免 Qmsg 酱被 Tencent 冻结，pushoo 会自动删除消息中的网址和 IP 地址。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前往 &lt;a href=&quot;https://qmsg.zendee.cn/&quot; target=&quot;_blank&quot;&gt;https://qmsg.zendee.cn/&lt;/a&gt; 并使用 QQ 登录&lt;/li&gt;
&lt;li&gt;点击 “管理台”，选择一个 Qmsg 酱，并添加 TA 为好友&lt;/li&gt;
&lt;li&gt;在 “我的QQ列表” 中添加自己的 QQ 号&lt;/li&gt;
&lt;li&gt;复制 “我的KEY” 下方的 key，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;d3e96b6c50adf28cc6d1bb*****a4613&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://sct.ftqq.com/r/13235&quot; target=&quot;_blank&quot;&gt;Server 酱&lt;/a&gt; 缩写: &lt;code&gt;serverchan&lt;/code&gt;&lt;a href=&quot;#-server-酱-缩写-serverchan&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Server 酱是方糖提供的第三方多渠道推送服务，以服务号推送起家，稳定运行多年，免费收费并存，特色功能较多。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前往 &lt;a href=&quot;https://sct.ftqq.com/r/13235&quot; target=&quot;_blank&quot;&gt;https://sct.ftqq.com/r/13235&lt;/a&gt; 并使用微信登录&lt;/li&gt;
&lt;li&gt;点击 “消息通道”，设置合适的消息通道并保存&lt;/li&gt;
&lt;li&gt;点击 “SendKey”，复制 “SendKey” 下方的 key，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;SCT1364TKdsiGjGvyAZNYD*****VAK0k&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://www.pushplus.plus/&quot; target=&quot;_blank&quot;&gt;Push Plus&lt;/a&gt; 缩写: &lt;code&gt;pushplus&lt;/code&gt;&lt;a href=&quot;#-push-plus-缩写-pushplus&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Push Plus 是苏州破壳网络科技有限公司提供的第三方微信服务号推送服务，免费版存在不影响使用的广告，会员版特权如下：&lt;a href=&quot;https://www.pushplus.plus/vip.html%E3%80%82&quot; target=&quot;_blank&quot;&gt;https://www.pushplus.plus/vip.html。&lt;/a&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前往 &lt;a href=&quot;https://www.pushplus.plus/&quot; target=&quot;_blank&quot;&gt;https://www.pushplus.plus/&lt;/a&gt; 并使用微信登录&lt;/li&gt;
&lt;li&gt;点击 “一对一推送”，复制 “你的token” 下方的 token，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;2832134a66df4da69ef941*****72317&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://pushplus.hxtrip.com/&quot; target=&quot;_blank&quot;&gt;Push Plus Hxtrip&lt;/a&gt; 缩写: &lt;code&gt;pushplushxtrip&lt;/code&gt;&lt;a href=&quot;#-push-plus-hxtrip-缩写-pushplushxtrip&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Push Plus Hxtrip 是中道（苏州）旅游网络科技有限公司提供的第三方微信服务号推送服务，免费无广告&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前往 &lt;a href=&quot;https://pushplus.hxtrip.com/message&quot; target=&quot;_blank&quot;&gt;https://pushplus.hxtrip.com/message&lt;/a&gt; 并使用微信登录&lt;/li&gt;
&lt;li&gt;复制 “您的Token” 下方的 Token，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;2a00acb27e414ea4bf9d19*****08986&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://open.dingtalk.com/document/group/custom-robot-access&quot; target=&quot;_blank&quot;&gt;钉钉&lt;/a&gt; 缩写: &lt;code&gt;dingtalk&lt;/code&gt;&lt;a href=&quot;#-钉钉-缩写-dingtalk&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;钉钉是阿里推出的办公即时消息软件，官方提供了机器人 API，可实现消息推送，免费。推送的消息必须包含配置的关键字，否则推送不成功。只能在群聊中创建机器人，可选择 2 名好友组建群聊，然后移除 2 名好友（好友会收到提醒，请谨慎操作），再添加机器人。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;根据 &lt;a href=&quot;https://open.dingtalk.com/document/group/custom-robot-access&quot; target=&quot;_blank&quot;&gt;https://open.dingtalk.com/document/group/custom-robot-access&lt;/a&gt; 的说明，创建一个机器人。如果是在 Twikoo 评论系统中使用，请配置关键字为 “评论”&lt;/li&gt;
&lt;li&gt;复制机器人的 Webhook，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;https://oapi.dingtalk.com/robot/send?access_token=06ff1823a060af772677680d9522b547bc2685251d47bed17ddada*****41d97&lt;/code&gt;（完整的 Webhook）或者 &lt;code&gt;06ff1823a060af772677680d9522b547bc2685251d47bed17ddada*****41d97&lt;/code&gt;（只保留 access token）&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://guole.fun/posts/626/&quot; target=&quot;_blank&quot;&gt;企业微信&lt;/a&gt; 缩写: &lt;code&gt;wecom&lt;/code&gt;&lt;a href=&quot;#-企业微信-缩写-wecom&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;企业微信应用消息推送，免费，限制较少。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;用电脑打开 &lt;a href=&quot;https://work.weixin.qq.com/%EF%BC%8C%E6%B3%A8%E5%86%8C%E4%B8%80%E4%B8%AA%E4%BC%81%E4%B8%9A&quot; target=&quot;_blank&quot;&gt;https://work.weixin.qq.com/，注册一个企业&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;注册成功后，点「管理企业」进入管理界面，选择「应用管理」 → 「自建」 → 「创建应用」&lt;/li&gt;
&lt;li&gt;应用名称填入机器人的名称，应用 logo 选择机器人的头像，可见范围选择公司名&lt;/li&gt;
&lt;li&gt;创建完成后进入应用详情页，可以得到应用ID( &lt;code&gt;agentid&lt;/code&gt; )，应用Secret( &lt;code&gt;secret&lt;/code&gt; )，复制
PS：获取应用Secret时，可能会将其推送到企业微信客户端，这时候微信里边是看不到的，需要在企业微信客户端里边才能看到&lt;/li&gt;
&lt;li&gt;进入「&lt;a href=&quot;https://work.weixin.qq.com/wework_admin/frame#profile&quot; target=&quot;_blank&quot;&gt;我的企业&lt;/a&gt;」页面，拉到最下边，可以看到企业ID，复制&lt;/li&gt;
&lt;li&gt;进入「我的企业」 → 「&lt;a href=&quot;https://work.weixin.qq.com/wework_admin/frame#profile/wxPlugin&quot; target=&quot;_blank&quot;&gt;微信插件&lt;/a&gt;」，拉到下边扫描二维码，关注以后即可收到推送的消息&lt;/li&gt;
&lt;li&gt;将第 4 步和第 5 步取得的 &lt;code&gt;企业ID#应用Secret#应用ID&lt;/code&gt; 拼到一起，中间用 “&lt;code&gt;#&lt;/code&gt;” 号分隔，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;ww97a01a*****1e5f1#xHapDXmgZtlBgRQQXMb4kfh3y75Ynoubl*****l9ytE#1000005&lt;/code&gt;&lt;/p&gt;&lt;p&gt;PS：如果出现接口请求正常，企业微信接受消息正常，个人微信无法收到消息的情况，请确认如下配置：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;进入「我的企业」 → 「微信插件」，拉到最下方，勾选「允许成员在微信插件中接收和回复聊天消息 」&lt;/li&gt;
&lt;li&gt;在企业微信客户端 「我」 → 「设置」 → 「新消息通知」中关闭「仅在企业微信中接受消息」限制条件&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://github.com/Finb/Bark&quot; target=&quot;_blank&quot;&gt;Bark&lt;/a&gt; 缩写: &lt;code&gt;bark&lt;/code&gt;&lt;a href=&quot;#-bark-缩写-bark&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Bark 是 iOS 通知中心推送工具，可以推送消息到苹果手机上，免费。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;下载 &lt;a href=&quot;https://apps.apple.com/cn/app/bark-%E7%BB%99%E4%BD%A0%E7%9A%84%E6%89%8B%E6%9C%BA%E5%8F%91%E6%8E%A8%E9%80%81/id1403753865&quot; target=&quot;_blank&quot;&gt;Bark APP&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;轻触下方 “服务器”，复制第一个服务器地址，删除 “这里改成你自己的推送内容” 字样，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;https://api.day.app/q2S4vQqpNyaS*****9neeJ/&lt;/code&gt;（完整的 URL）或者 &lt;code&gt;q2S4vQqpNyaS*****9neeJ&lt;/code&gt;（只保留 token）&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://docs.go-cqhttp.org/api/&quot; target=&quot;_blank&quot;&gt;go-cqhttp&lt;/a&gt; 缩写: &lt;code&gt;gocqhttp&lt;/code&gt;&lt;a href=&quot;#-go-cqhttp-缩写-gocqhttp&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;go-cqhttp 是开源 QQ 机器人程序，免费，需自行搭建，插件十分丰富，但 “野生” 机器人并没有得到 Tencent 官方的支持，有账号被冻结的风险。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前往 &lt;a href=&quot;https://github.com/Mrs4s/go-cqhttp&quot; target=&quot;_blank&quot;&gt;go-cqhttp release&lt;/a&gt; 下载对应系统版本&lt;/li&gt;
&lt;li&gt;此处省略安装过程，可参考 &lt;a href=&quot;https://docs.go-cqhttp.org/guide/quick_start.html&quot; target=&quot;_blank&quot;&gt;https://docs.go-cqhttp.org/guide/quick_start.html&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;修改配置文件，配置 &lt;code&gt;default-middlewares&lt;/code&gt; 下面的 &lt;code&gt;access-token&lt;/code&gt;，启动 go-cqhttp&lt;/li&gt;
&lt;li&gt;按照示例所示的 API 调用地址，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;http://你的IP或域名:端口号/send_private_msg?user_id=QQ号&amp;amp;access_token=你配置的token&lt;/code&gt;（QQ号）或 &lt;code&gt;http://你的IP或域名:端口号/send_group_msg?group_id=群号&amp;amp;access_token=你配置的token&lt;/code&gt;（QQ群）&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://github.com/TIANLI0/push-bot-api/&quot; target=&quot;_blank&quot;&gt;atri&lt;/a&gt; 缩写: &lt;code&gt;atri&lt;/code&gt;&lt;a href=&quot;#-atri-缩写-atri&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;go-cqhttp 是开源 QQ 机器人程序，由&lt;a href=&quot;https://blog.tianli0.top/&quot; target=&quot;_blank&quot;&gt;Tianli&lt;/a&gt;提供的pushoo推送服务。&lt;/p&gt;&lt;p&gt;使用前请加机器人好友（QQ：2102916311）&lt;/p&gt;&lt;p&gt;示例 token：&lt;code&gt;1627236613&lt;/code&gt;（QQ号）&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://www.pushdeer.com/&quot; target=&quot;_blank&quot;&gt;PushDeer&lt;/a&gt; 缩写: &lt;code&gt;pushdeer&lt;/code&gt;&lt;a href=&quot;#-pushdeer-缩写-pushdeer&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;PushDeer 是方糖一个开源的无 APP 推送解决方案，支持 iOS 14+ 轻应用、MacOS 11+ 客户端、Android 快应用，免费。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前往 &lt;a href=&quot;https://www.pushdeer.com/product.html&quot; target=&quot;_blank&quot;&gt;https://www.pushdeer.com/product.html&lt;/a&gt; 扫码打开轻应用并登录&lt;/li&gt;
&lt;li&gt;轻触下方 “Key”，轻触右上角 “+” 号创建第一个 Key，复制，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;PDU431TfFHZICvR6lJrFBswSRN1cJ*****zzFvR&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://push.hellyw.com/&quot; target=&quot;_blank&quot;&gt;iGot&lt;/a&gt; 缩写: &lt;code&gt;igot&lt;/code&gt;&lt;a href=&quot;#-igot-缩写-igot&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;iGot 是一款聚合 APP、邮箱、微信等多种推送方式的第三方推送平台，免费，存在影响体验的广告。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;根据 &lt;a href=&quot;https://push.hellyw.com/doc/&quot; target=&quot;_blank&quot;&gt;https://push.hellyw.com/doc/&lt;/a&gt; 的说明，获取推送 key，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;621f3b1dd2eba1*****101d9&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://core.telegram.org/bots&quot; target=&quot;_blank&quot;&gt;Telegram&lt;/a&gt; 缩写: &lt;code&gt;telegram&lt;/code&gt;&lt;a href=&quot;#-telegram-缩写-telegram&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Telegram 是自由的聊天工具，支持机器人 API，免费，中国大陆服务器无法使用这种推送方式。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;通过 &lt;a href=&quot;https://t.me/BotFather&quot; target=&quot;_blank&quot;&gt;@BotFather&lt;/a&gt; 创建机器人，并获取 &lt;code&gt;api_token&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;通过 &lt;a href=&quot;https://t.me/userinfobot&quot; target=&quot;_blank&quot;&gt;@userinfobot&lt;/a&gt; 获取接受消息对象的 &lt;code&gt;chat_id&lt;/code&gt;。接受消息的对象可以是用户，频道，或群组&lt;/li&gt;
&lt;li&gt;将第 1 步和第 2 步取得的 &lt;code&gt;api_token#chat_id&lt;/code&gt; 拼到一起，中间用 “&lt;code&gt;#&lt;/code&gt;” 号分隔，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;5262***170:AAEzkaMjOayU13fFzcg9PI7_7*****p1iAs#958***732&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://www.feishu.cn/hc/zh-CN/articles/360024984973&quot; target=&quot;_blank&quot;&gt;飞书&lt;/a&gt; 缩写: &lt;code&gt;feishu&lt;/code&gt;&lt;a href=&quot;#-飞书-缩写-feishu&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;飞书是字节跳动旗下的办公即时消息软件，官方提供了机器人 API，可实现消息推送，免费。推送的消息必须包含配置的关键字，否则推送不成功。只能在群聊中创建机器人。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;进入群组，打开会话设置，找到群机器人，并点击添加机器人，选择自定义机器人并添加。如果是在 Twikoo 评论系统中使用，请配置关键字为 “评论”&lt;/li&gt;
&lt;li&gt;复制机器人的 Webhook，填入 pushoo 的 token 中&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;https://open.feishu.cn/open-apis/bot/v2/hook/393df85f-7b2c-4ff6-bd4f-*******3ed54&lt;/code&gt;（完整的 Webhook）或者 &lt;code&gt;393df85f-7b2c-4ff6-bd4f-*******3ed54&lt;/code&gt;（只保留 access token）&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://ifttt.com/maker_webhooks&quot; target=&quot;_blank&quot;&gt;IFTTT&lt;/a&gt; 缩写: &lt;code&gt;ifttt&lt;/code&gt;&lt;a href=&quot;#-ifttt-缩写-ifttt&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;IFTTT Webhooks推送，免费。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;首先打开 &lt;a href=&quot;http://ifttt.com/maker%EF%BC%8C%E7%A1%AE%E4%BF%9D%E4%BD%A0%E7%9A%84WebHooks%E6%9C%8D%E5%8A%A1%E6%98%AF%E5%8F%AF%E4%BB%A5%E7%94%A8%EF%BC%9B&quot; target=&quot;_blank&quot;&gt;http://ifttt.com/maker，确保你的WebHooks服务是可以用；&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;点击 &lt;code&gt;Document&lt;/code&gt; 获取你的 &lt;strong&gt;Key&lt;/strong&gt;, 点击 &lt;code&gt;Create&lt;/code&gt; 开始创建一个Applet；&lt;/li&gt;
&lt;li&gt;If this Then that, this选择WebHooks，Trigger选择Receive a web request，Event Name填一个有意义的，如 &lt;code&gt;push&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;if this then that, that选择Notification，参数填Value1 、Value2、Value3;&lt;/li&gt;
&lt;li&gt;将 2 步获取的 &lt;strong&gt;key&lt;/strong&gt; 和 第 3 步设置的 &lt;strong&gt;Event Name&lt;/strong&gt; 拼接到一起，中间用 “&lt;code&gt;#&lt;/code&gt;” 号分隔，填入 pushoo 的 token 中。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;code&gt;d-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx#push&lt;/code&gt;&lt;/p&gt;&lt;p&gt;PS: title 和 content 会分别对应 Value1 和 Value2，如果要设置 Value3 请在 options 设置&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://developer.work.weixin.qq.com/document/path/91770&quot; target=&quot;_blank&quot;&gt;WECOMBOT&lt;/a&gt; 缩写: &lt;code&gt;wecombot&lt;/code&gt;&lt;a href=&quot;#-wecombot-缩写-wecombot&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;企业微信群机器人推送，免费。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;使用企业微信，作为群管理员，创建一个群机器人，复制出机器人的 Webhook；&lt;/li&gt;
&lt;li&gt;然后在 Webhook 中提取出 &lt;code&gt;key&lt;/code&gt; 值，填入 pushoo 的 token 中.&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token: &lt;code&gt;https://qyapi.weixin.qq.com/cgi-bin/webhook/send?key=xxxxxxxx-xxxx-xx&lt;/code&gt; Webhook中提取Token为 &lt;code&gt;xxxxxxxx-xxxx-xx&lt;/code&gt;;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://discord.com/developers/docs/resources/webhook#execute-webhook&quot; target=&quot;_blank&quot;&gt;Discord&lt;/a&gt; 缩写: &lt;code&gt;discord&lt;/code&gt;&lt;a href=&quot;#-discord-缩写-discord&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Discord Webhooks推送，免费。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;打开Discord，进入频道设置，找到webhook，点击创建&lt;code&gt;webhook&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;复制webhook的url，将整个URL填入pushoo的&lt;code&gt;token&lt;/code&gt;中。&lt;/li&gt;
&lt;li&gt;如果需要设置用户名和头像，可以在&lt;code&gt;options&lt;/code&gt;中设置。&lt;/li&gt;
&lt;li&gt;token 设置也可以通过提取 &lt;code&gt;webhook&lt;/code&gt; url 中的 &lt;code&gt;id&lt;/code&gt; 和 &lt;code&gt;token&lt;/code&gt; 来设置，格式为 &lt;code&gt;id#token&lt;/code&gt;。 如：&lt;code&gt;https://discord.com/api/webhooks/123456789012345678/abcdefghijklmnopqrstuvwxyz&lt;/code&gt;，则 token 设置为 &lt;code&gt;123456789012345678#abcdefghijklmnopqrstuvwxyz&lt;/code&gt;。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;https://discord.com/api/webhooks/123456789012345678/abcdefghijklmnopqrstuvwxyz&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;&lt;code&gt;123456789012345678#abcdefghijklmnopqrstuvwxyz&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://wxpusher.zjiecode.com/docs/&quot; target=&quot;_blank&quot;&gt;WxPusher&lt;/a&gt; 缩写: &lt;code&gt;wxpusher&lt;/code&gt;&lt;a href=&quot;#-wxpusher-缩写-wxpusher&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;WxPusher 是一款微信推送平台，免费。&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;打开 &lt;a href=&quot;https://wxpusher.zjiecode.com/admin/&quot; target=&quot;_blank&quot;&gt;https://wxpusher.zjiecode.com/docs/&lt;/a&gt;，注册账号，创建应用，获取 &lt;code&gt;appToken&lt;/code&gt;;&lt;/li&gt;
&lt;li&gt;创建主题，获取主题ID。如：&lt;code&gt;1234&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;使用微信关注创建的主题，完成主题订阅；&lt;/li&gt;
&lt;li&gt;如果需要设置特定推送用户，可以在 &lt;code&gt;options&lt;/code&gt; 中设置 &lt;code&gt;uids&lt;/code&gt;; 如果要设置消息跳转链接，可以在 &lt;code&gt;options&lt;/code&gt; 中设置 &lt;code&gt;url&lt;/code&gt;；如果需要设置验证支付，可以在 &lt;code&gt;options&lt;/code&gt; 中设置 &lt;code&gt;verifyPay&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;最后获取的 &lt;code&gt;appToken&lt;/code&gt; 和 &lt;code&gt;topicId&lt;/code&gt; 拼接到一起，中间用 “&lt;code&gt;#&lt;/code&gt;” 号分隔，填入 pushoo 的 token 中（如果有多个主题ID，可用半角逗号分隔）。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;示例 token:&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;单个主题ID：&lt;code&gt;AT_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX#1234&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;多个主题ID：&lt;code&gt;AT_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX#1234,5678&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;💬 &lt;a href=&quot;https://joaoapps.com/join/&quot; target=&quot;_blank&quot;&gt;Join&lt;/a&gt; 缩写: &lt;code&gt;join&lt;/code&gt;&lt;a href=&quot;#-join-缩写-join&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;示例 token: &lt;code&gt;apiKey#deviceId&lt;/code&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>部署Twikoo到cloudflaer</title><link>https://firefly.cuteleaf.cn/posts/%E9%83%A8%E7%BD%B2twikoo%E5%88%B0cloudflaer/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E9%83%A8%E7%BD%B2twikoo%E5%88%B0cloudflaer/</guid><pubDate>Sun, 17 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;部署Twikoo&lt;a href=&quot;#部署twikoo&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;复制仓库&lt;a href=&quot;#复制仓库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;首先 &lt;a href=&quot;https://github.com/wuzhengmao/twikoo-cloudflare/fork&quot; target=&quot;_blank&quot;&gt;Fork&lt;/a&gt; 博主的仓库，输入你自己的仓库名称，点击 &lt;code&gt;Create fork&lt;/code&gt; 按钮创建自己的仓库。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/github-fork.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;blockquote&gt;&lt;p&gt;&lt;strong&gt;国内对github的访问向来是时断时续的，如果安装失败可以等一等，或者使用科学上网工具，这里推荐可以 &lt;a href=&quot;https://speedv.219226.xyz/#/register&quot; target=&quot;_blank&quot;&gt;注册&lt;/a&gt; 一个，目前有免费流量可以薅羊毛。&lt;/strong&gt;&lt;/p&gt;&lt;/blockquote&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;创建D1数据库&lt;a href=&quot;#创建d1数据库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;登录 &lt;a href=&quot;https://dash.cloudflare.com/&quot; target=&quot;_blank&quot;&gt;Cloudflare&lt;/a&gt;，点击左侧栏 &lt;code&gt;存储和数据库&lt;/code&gt; - &lt;code&gt;D1 SQL数据库&lt;/code&gt;，点击 &lt;code&gt;创建&lt;/code&gt; 按钮，填入 &lt;code&gt;twikoo&lt;/code&gt; 作为数据库名后，点击 &lt;code&gt;创建&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-d1.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;创建成功后回到列表页面，可以找到对应红框中的 &lt;code&gt;ID&lt;/code&gt; 复制出来。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-get-database-id.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;然后点击 &lt;code&gt;twikoo&lt;/code&gt; 数据库，选择 &lt;code&gt;控制台&lt;/code&gt; 页签，将仓库根目录下的 &lt;code&gt;schema.sql&lt;/code&gt; 文件中的内容全部复制到输入框中，点击 &lt;code&gt;执行&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-table.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;很快数据库表就创建完了，最后修改仓库根目录下的 &lt;code&gt;wrangler.toml&lt;/code&gt; 文件中的 &lt;code&gt;database_id&lt;/code&gt; 值。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[[&lt;/span&gt;&lt;span&gt;d1_databases&lt;/span&gt;&lt;span&gt;]]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;binding&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;DB&quot;&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;# available in your Worker on env.DB&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;database_name&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;twikoo&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;database_id&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;b35e0bd5-6d17-42eb-a597-ff4869a74461&quot;&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;# 这里替换成你前面红框里的内容&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;创建R2存储&lt;a href=&quot;#创建r2存储&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;点击左侧栏 &lt;code&gt;R2 对象存储&lt;/code&gt;，点击 &lt;code&gt;创建存储桶&lt;/code&gt;，填入 &lt;code&gt;twikoo&lt;/code&gt; 作为存储桶名称，点击 &lt;code&gt;创建存储桶&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-r2.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;创建成功后后回到列表页面，就可以看到刚才创建的存储桶了。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-r2-done.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;再点击 &lt;code&gt;twikoo&lt;/code&gt; 进入存储桶，点击 &lt;code&gt;设置&lt;/code&gt; 页签，在 &lt;code&gt;公开访问&lt;/code&gt; 点击 &lt;code&gt;连接域&lt;/code&gt;， 输入你想设置的域名比如 &lt;code&gt;twikoo.r2.example.org&lt;/code&gt;。如果还没有个人域名的可以看我的另外一篇博客 &lt;a href=&quot;https://blog.mingy.org/2024/12/register-domain-with-cloudflare/&quot; target=&quot;_blank&quot;&gt;如何注册一个域名并托管到Cloudflare&lt;/a&gt;。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-r2-bind-domain.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;然后点击 &lt;code&gt;继续&lt;/code&gt;，再点击 &lt;code&gt;连接域&lt;/code&gt; 就会回到设置页面，这时你会看到你设置的域状态为 &lt;code&gt;正在初始化&lt;/code&gt;，过几分钟再次刷新状态就变成了 &lt;code&gt;活动&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-r2-bind-done.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;接下来还需要将刚才的域名写入修改仓库根目录下的 &lt;code&gt;wrangler.toml&lt;/code&gt; 文件中。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;vars&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;R2_PUBLIC_URL&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;https://twikoo.r2.example.org&quot;&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;# 这里替换成你设置的域名&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;Worker部署&lt;a href=&quot;#worker部署&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;在 &lt;code&gt;Cloudflare&lt;/code&gt; 的左侧栏点击 &lt;code&gt;Workers 和 Pages&lt;/code&gt;，点击 &lt;code&gt;创建&lt;/code&gt;，再点击 &lt;code&gt;创建 Worker&lt;/code&gt;，输入名称 &lt;code&gt;cf-create-worker&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-worker.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;然后点击 &lt;code&gt;部署&lt;/code&gt;，过一会显示部署成功，再点击 &lt;code&gt;继续处理项目&lt;/code&gt;，选择 &lt;code&gt;设置&lt;/code&gt; 页签，滚动到构建区域，点击 &lt;code&gt;连接&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-worker-connect.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;此时右侧会弹出一个面板，先连接你的 &lt;code&gt;Github&lt;/code&gt; 账号，然后选择你的仓库，如果列表中找不到可以直接输入仓库名，比如 &lt;code&gt;twikoo-cloudflare&lt;/code&gt;，再选择 &lt;code&gt;main&lt;/code&gt; 分支。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-worker-deploy.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;然后在 &lt;code&gt;部署命令&lt;/code&gt; 的输入框中填入 &lt;code&gt;npx wrangler deploy --minify&lt;/code&gt;，最后点击 &lt;code&gt;连接&lt;/code&gt; 按钮保存。&lt;/p&gt;&lt;p&gt;如果在前一步的列表中仓库名是手动输入的，你需要在这里点击 &lt;code&gt;管理&lt;/code&gt; 按钮，跳转到 &lt;code&gt;Github&lt;/code&gt; 登录账号。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-connect-github.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;完成登录后进入 &lt;code&gt;Repository access&lt;/code&gt; 页面，点击 &lt;code&gt;Select repositories&lt;/code&gt; 按钮，选择你的仓库后点击 &lt;code&gt;Save&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/github-select-repo.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;此时页面会跳转回 &lt;code&gt;Cloudflare&lt;/code&gt;，有可能会报一个错误，不用管它，直接关闭页面就可以了。&lt;/p&gt;&lt;p&gt;现在把前面修改的 &lt;code&gt;wrangler.toml&lt;/code&gt; 文件保存并提交到 &lt;code&gt;Github&lt;/code&gt; 仓库，此时就会触发 &lt;code&gt;Worker&lt;/code&gt; 的自动构建了，过一会你就会在 &lt;code&gt;Workers 和 Pages&lt;/code&gt; 页面看到部署已经更新，点击 &lt;code&gt;访问&lt;/code&gt; 按钮，一切正常的话，你会看到这样的内容。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;{&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;&quot;code&quot;&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;100&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;&quot;message&quot;&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;&quot;Twikoo 云函数运行正常，请参考 https://twikoo.js.org/frontend.html 完成前端的配置&quot;&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;&quot;version&quot;&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;&quot;1.6.40&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;绑定域名&lt;a href=&quot;#绑定域名&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;再次点击 &lt;code&gt;twikoo-cloudflare&lt;/code&gt; 进入 &lt;code&gt;设置&lt;/code&gt; 页签，在 &lt;code&gt;域和路由&lt;/code&gt; 中点击 &lt;code&gt;添加&lt;/code&gt;，右侧弹出 &lt;code&gt;域和路由&lt;/code&gt; 面板。点击 &lt;code&gt;自定义域&lt;/code&gt;，输入你想要绑定的域名，比如 &lt;code&gt;twikoo.example.org&lt;/code&gt;，点击 &lt;code&gt;添加域&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-worker-bind-domain.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;添加完成后你的域名就和部署的 &lt;code&gt;Worker&lt;/code&gt; 绑定好了。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;配置博客&lt;a href=&quot;#配置博客&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;修改主题配置&lt;a href=&quot;#修改主题配置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;回到上一篇创建的个人博客仓库，在 &lt;code&gt;themes/hexo-theme-matery&lt;/code&gt; 目录下打开 &lt;code&gt;_config.yml&lt;/code&gt; 文件进行编辑，搜索关键字 &lt;code&gt;twikoo&lt;/code&gt; 将 &lt;code&gt;enabled&lt;/code&gt; 改为 &lt;code&gt;true&lt;/code&gt;，再将 &lt;code&gt;envId&lt;/code&gt; 改成前面部署绑定的域名。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;twikoo&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;enable&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;envId&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;https://twikoo.example.org&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;# 这里改成前面部署绑定的域名&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;# region: ap-guangzhou # 环境地域，默认为 ap-shanghai&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;# path: &apos;window.location.pathname&apos; # 自定义文章路径&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;修改完提交到 &lt;code&gt;Github&lt;/code&gt; 后 &lt;code&gt;Cloudflare Pages&lt;/code&gt; 会自动部署，等部署完打开你的个人博客，在你的博文最下面就可以看到评论区了。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/hexo-show-comments.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;配置评论模块&lt;a href=&quot;#配置评论模块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;点击评论区的小齿轮图标，首次进入需要设置密码，设置完就会进入管理面板，点击 &lt;code&gt;配置管理&lt;/code&gt; 页签进行初始配置。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/twikoo-config-panel.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;点开 &lt;code&gt;隐私&lt;/code&gt;，在 &lt;code&gt;IMAGE_CDN&lt;/code&gt; 处输入 &lt;code&gt;cloudflare&lt;/code&gt;，点击 &lt;code&gt;保存&lt;/code&gt; 按钮启用图片上传功能。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/twikoo-set-image-cdn.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;其余每个配置项都有很详细的说明，大家可以自行慢慢摸索，不修改也已经可以正常使用了。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;防止机器人&lt;a href=&quot;#防止机器人&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;发表评论时可以使用 &lt;code&gt;Cloudflare Turnstile&lt;/code&gt; 的检查来阻止机器人，如果需要启用先在 &lt;code&gt;Cloudflare&lt;/code&gt; 的左侧栏点击 &lt;code&gt;Turnstile&lt;/code&gt;，点击 &lt;code&gt;添加小组件&lt;/code&gt; 按钮。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-turnstile.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;小组件名称可以随便填写，比如 &lt;code&gt;twikoo&lt;/code&gt;，点击下面的 &lt;code&gt;添加主机名&lt;/code&gt; 按钮会在右侧弹出面板。在最上面的输入框填入个人博客的域名，比如 &lt;code&gt;blog.example.org&lt;/code&gt;，点击右侧的 &lt;code&gt;添加&lt;/code&gt; 按钮，主机名就会出现在下面的已选择主机名列表中。再点击最下面的 &lt;code&gt;添加&lt;/code&gt; 按钮，右侧面板关闭，主机名会添加到 &lt;code&gt;主机名管理&lt;/code&gt; 区域的列表中。最后点击右下角的 &lt;code&gt;创建&lt;/code&gt; 按钮，就会显示已成功创建 &lt;code&gt;Turnstile&lt;/code&gt; 小组件。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/cf-create-turnstile-ok.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;在这个页面上 &lt;code&gt;站点密钥&lt;/code&gt; 和 &lt;code&gt;密钥&lt;/code&gt; 是你需要复制下来配置到 &lt;code&gt;Twikoo&lt;/code&gt; 的管理面板中的。接下来再次打开管理面板，点开 &lt;code&gt;反垃圾&lt;/code&gt;，在 &lt;code&gt;TURNSTILE_SITE_KEY&lt;/code&gt; 处填入 &lt;code&gt;站点密钥&lt;/code&gt; 的内容，在 &lt;code&gt;TURNSTILE_SECRET_KEY&lt;/code&gt; 处填入 &lt;code&gt;密钥&lt;/code&gt; 的内容，点击 &lt;code&gt;保存&lt;/code&gt; 关闭面板。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/twikoo-config-turnstile.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;完成后再次发表评论就会出现 &lt;code&gt;Cloudflare&lt;/code&gt; 的机器人检查框了，大部分情况下等一会就会显示成功，或者出现一个勾选框确认后检查成功，只有极少数情况会发起 &lt;code&gt;JS质询&lt;/code&gt; 进行挑战。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/twikoo-post-comments.png&quot; alt=&quot;img&quot; /&gt;&lt;figcaption&gt;img&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;后记&lt;a href=&quot;#后记&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;至此，一个基本上完整的评论系统就上线了，对于 &lt;code&gt;Twikoo&lt;/code&gt; 的其他配置，还有一些建议：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;使用隐藏入口不要暴露管理面板的配置按钮；&lt;/li&gt;
&lt;li&gt;设置一个复杂的密码不要让别人轻易猜出来；&lt;/li&gt;
&lt;li&gt;添加评论通知，&lt;a href=&quot;https://pushoo.js.org/&quot; target=&quot;_blank&quot;&gt;pushoo.js&lt;/a&gt; 提供了丰富的通知方式，可以自行看文档选择最适合的方式。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;来源: 一梦一孤舟
文章作者: Mingy
文章链接: &lt;a href=&quot;https://blog.mingy.org/2024/12/hexo-add-twikoo/&quot; target=&quot;_blank&quot;&gt;https://blog.mingy.org/2024/12/hexo-add-twikoo/&lt;/a&gt;
本文章著作权归作者所有，任何形式的转载都请注明出处。&lt;/p&gt;&lt;/section&gt;</content:encoded></item><item><title>教材中的岳飞竟然被爱迪生救妈妈取代了</title><link>https://firefly.cuteleaf.cn/posts/%E6%95%99%E6%9D%90%E4%B8%AD%E7%9A%84%E5%B2%B3%E9%A3%9E%E7%AB%9F%E7%84%B6%E8%A2%AB%E7%88%B1%E8%BF%AA%E7%94%9F%E6%95%91%E5%A6%88%E5%A6%88%E5%8F%96%E4%BB%A3%E4%BA%86/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E6%95%99%E6%9D%90%E4%B8%AD%E7%9A%84%E5%B2%B3%E9%A3%9E%E7%AB%9F%E7%84%B6%E8%A2%AB%E7%88%B1%E8%BF%AA%E7%94%9F%E6%95%91%E5%A6%88%E5%A6%88%E5%8F%96%E4%BB%A3%E4%BA%86/</guid><pubDate>Sat, 09 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;还记得被移除教材的&lt;a href=&quot;#还记得被移除教材的&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;岳　飞&lt;a href=&quot;#岳飞&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;一代英雄，千古忠魂&lt;/p&gt;&lt;p&gt;◆&lt;/p&gt;&lt;p&gt;怒发冲冠，凭栏处、潇潇雨歇。&lt;br /&gt;
抬望眼、仰天长啸，壮怀激烈。&lt;br /&gt;
三十功名尘与土，八千里路云和月。&lt;br /&gt;
&lt;strong&gt;莫等闲，白了少年头，空悲切！&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;——岳飞《满江红》&lt;/p&gt;&lt;section&gt;&lt;h2&gt;壹 · 乱世出英雄&lt;a href=&quot;#壹--乱世出英雄&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;北宋末年，朝堂昏聩，水旱频发，田地荒芜，民不聊生。外敌铁蹄践踏中原，百姓在天灾人祸的双重夹击下苦苦挣扎。岳飞，便出生在这样一个风雨飘摇的乱世之中。&lt;/p&gt;&lt;p&gt;一场无情的洪水夺走了他的父亲，使本就贫寒的家境雪上加霜。然而，正是在这样的困苦之中，岳飞目睹了家国的内忧外患，也在岳母的熏陶下，心中早早种下了&lt;strong&gt;提三尺剑，立不世之功&lt;/strong&gt;的远大志向。&lt;/p&gt;&lt;p&gt;家境贫寒，无力从师，岳飞便每日以黄沙铺地，用树枝练字习武。这份坚韧刻苦，最终打动了名师周桐，将一身本领倾囊相授。出师之后的岳飞博览群书，将春秋兵法熟烂于心，又习得一身精湛武艺，终成可造之材。&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;贰 · 披甲上阵，壮志报国&lt;a href=&quot;#贰--披甲上阵壮志报国&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;金人南下侵略中原，岳飞在岳母的鼓励下毅然参军。此后宋军兵败如山倒，一众皇室宗亲被金人掳去，都城遭到洗劫，北宋就此灭亡——&lt;strong&gt;靖康之变&lt;/strong&gt;，成为宋王朝永远抹不去的耻辱。&lt;/p&gt;&lt;p&gt;赵构称帝南渡，却无意收复河山，只图苟且偷安，将北方千万黎民、祖宗坟茔拱手相让。岳飞忍无可忍，愤然上书，反对南逃投降，却因此触怒上级，被革去军职。&lt;/p&gt;&lt;p&gt;不得已，他北上投奔抗金义军，在危难之际被东京留守宗泽所救，收于麾下。自此，陷阵沙场的岳飞如蛟龙得水，凭借过人才能，一路破阵杀敌，威名渐起。&lt;/p&gt;&lt;p&gt;“出师未捷身先死，&lt;br /&gt;
长使英雄泪满襟。”&lt;/p&gt;&lt;p&gt;——恩师宗泽弥留之际的长叹&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;叁 · 岳家军，金人噩梦&lt;a href=&quot;#叁--岳家军金人噩梦&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;恩师宗泽离世，朝廷君臣窜逃，破碎的山河，无一不刺痛着岳飞的心。他决心完成恩师遗愿，沿途收拢溃散军士，严明治军。岳飞的信念与意志感染着每一位将士，一支钢铁之师——&lt;strong&gt;岳家军&lt;/strong&gt;，就此诞生。&lt;/p&gt;&lt;p&gt;1129 年&lt;/p&gt;&lt;p&gt;在广德袭击金兵，势如破竹，令金人闻风丧胆。&lt;/p&gt;&lt;p&gt;1133 年&lt;/p&gt;&lt;p&gt;收复建康，继而光复襄阳六郡，南宋国威大振。&lt;/p&gt;&lt;p&gt;1136 年&lt;/p&gt;&lt;p&gt;率军攻克陕西、河南多地，北伐势头锐不可当。&lt;/p&gt;&lt;p&gt;1140 年 · 郾城大捷&lt;/p&gt;&lt;p&gt;岳家军突入敌阵，&lt;strong&gt;以少胜多&lt;/strong&gt;，给予金军沉痛打击，并一路驱赶金军狼狈逃窜。直捣黄龙的梦想，触手可及……&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;肆 · 十二道金牌，壮志成灰&lt;a href=&quot;#肆--十二道金牌壮志成灰&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;然而，赵构所图，不过是阻止金人南下、保住半壁江山。就在岳飞即将渡河北上、光复失地的关键时刻，一天之内，&lt;strong&gt;十二道金牌&lt;/strong&gt;从临安飞驰而来，令岳家军班师。&lt;/p&gt;&lt;p&gt;天命难违，岳飞只能含泪南归。他望着北方苍茫的河山，泪流满面，悲愤交加，只余一声长叹：&lt;/p&gt;&lt;p&gt;“十年之功，废于一旦，&lt;br /&gt;
所得诸郡，一朝南下。”&lt;/p&gt;&lt;p&gt;岳飞班师的那一天，数万黎民夹道而立，哭声震动四野。用无数鲜血收复的国土，就此再度沦陷于金人铁蹄之下。&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;伍 · 莫须有，千古奇冤&lt;a href=&quot;#伍--莫须有千古奇冤&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;班师之后，岳飞被奸佞秦桧以&lt;strong&gt;莫须有&lt;/strong&gt;的罪名加害，投入大狱，遭受无尽迫害。直到生命的最后一刻，始终不肯屈服的岳飞，在供词上写下了这最后八个字——&lt;/p&gt;&lt;p&gt;天日昭昭&lt;/p&gt;&lt;p&gt;——岳飞狱中绝笔&lt;/p&gt;&lt;p&gt;公元1142年，一代抗金名将、民族英雄岳飞含冤离世，年仅&lt;strong&gt;三十九岁&lt;/strong&gt;。秦桧构陷岳飞的铁像，至今长跪于岳飞墓前，受万世唾骂。&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;陆 · 民族英雄，不可磨灭&lt;a href=&quot;#陆--民族英雄不可磨灭&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;然而，比岳飞蒙冤更令人痛心的，是近代发生的一场风波。2003年，曾有专家提出将岳飞从教材中移除，理由是”以现代眼光看，金人并非外族，岳飞抗金只算民族内部纷争，不能称之为民族英雄”。&lt;/p&gt;&lt;p&gt;此番说法，实乃滑天下之大稽。历史人物的评价，必须还原于其所处的历史语境。在家国存亡之秋，岳飞以血肉之躯守护百姓、抵御外侮、精忠报国——无论时代如何变迁，这份担当与牺牲，&lt;strong&gt;无愧于”民族英雄”四字&lt;/strong&gt;，这种民族之魂，绝不可磨灭。&lt;/p&gt;&lt;p&gt;试想，那些站在先人浴血打下的江山上，却要抹除民族英雄记忆的人，又该当何论？&lt;/p&gt;&lt;p&gt;所幸，人教版统编教材最终明确描述了岳飞的事迹，并郑重声明其始终是民族英雄。这，是历史的公道，也是亿万人心的坚守。&lt;/p&gt;&lt;p&gt;&lt;em&gt;三十功名尘与土，八千里路云和月。&lt;/em&gt;&lt;/p&gt;&lt;p&gt;如果真的有一天，岳飞、文天祥等人从教材中消失，屏幕前的我们，还记得他们吗？再过十年、二十年，下一代的记忆，会不会也渐渐模糊？&lt;/p&gt;&lt;p&gt;—— &lt;strong&gt;记住他们，就是守护我们自己的根。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;◆&lt;/p&gt;&lt;p&gt;— 历史 · 人物篇 壮志饥餐胡虏肉 笑谈渴饮匈奴血&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>晚清首富胡雪岩的江南第一豪宅</title><link>https://firefly.cuteleaf.cn/posts/%E8%83%A1%E9%9B%AA%E5%B2%A9/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E8%83%A1%E9%9B%AA%E5%B2%A9/</guid><pubDate>Sat, 09 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;晚清第一豪宅 · 杭州探秘&lt;/p&gt;
&lt;section&gt;&lt;h1&gt;我的身后，就是&lt;a href=&quot;#我的身后就是&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;晚清首富&lt;a href=&quot;#晚清首富&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;耗资 300 万两白银的传奇宅院&lt;/p&gt;&lt;p&gt;◆&lt;/p&gt;&lt;p&gt;来杭州旅游，很多人只知道西湖断桥，却不知道就在城内，藏着一座晚清首富胡雪岩耗资 &lt;strong&gt;300 万两白银&lt;/strong&gt; 铸就的江南第一豪宅。今天，我带大家推开这扇门，去看看一个放牛郎是如何走进中国商业的巅峰，又在这座宅院里留下了怎样的传奇。&lt;/p&gt;&lt;section&gt;&lt;h2&gt;壹 · 一扇门，手握乾坤&lt;a href=&quot;#壹--一扇门手握乾坤&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;还没进门，胡雪岩便已向你亮出了他的底牌。大门上那枚门把手造型独特——&lt;strong&gt;一只手，握住一个圆圈&lt;/strong&gt;，寓意”手握乾坤、手握大权”，同时兼作门铃使用。一个商人，把自己的野心刻进了入口最显眼的地方。&lt;/p&gt;&lt;p&gt;跨入正厅，两顶华贵的轿子映入眼帘——这里是胡雪岩的”车库”，停放着他的两辆”劳斯莱斯”。窗大的那顶是夏轿，通风凉爽；窗小的那顶是冬轿，内置火盆可取暖，堪称古代暖空调。两百多平的厅堂，就这样被两顶轿子填满了贵气。&lt;/p&gt;&lt;p&gt;正厅匾额 · 同治皇帝亲题&lt;/p&gt;&lt;p&gt;勉善承荣&lt;/p&gt;&lt;p&gt;“承”故意写作”成”——愿卿保持善良，乐善好施，一路走下去。&lt;br /&gt;
&lt;em&gt;整座宅院里，分量最重的四个字。&lt;/em&gt;&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;贰 · 楠木厅，价值十亿的传奇&lt;a href=&quot;#贰--楠木厅价值十亿的传奇&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;穿过廊道，走进整座旧居最令人屏息的地方——&lt;strong&gt;楠木厅，又称载福堂&lt;/strong&gt;。地板、柱子、梁架，全部采用极品金丝楠木打造。当你拿起手电筒照射柱身，黄金般的丝纹便在木芯深处流淌，宛若繁星，令人叹为观止。&lt;/p&gt;&lt;p&gt;～10亿&lt;/p&gt;&lt;p&gt;楠木厅当前估价（元）&lt;/p&gt;&lt;p&gt;1套房&lt;/p&gt;&lt;p&gt;一根柱子可换北京大别墅&lt;/p&gt;&lt;p&gt;十几吨&lt;/p&gt;&lt;p&gt;全宅黄铜用量&lt;/p&gt;&lt;p&gt;更令人惊叹的是，100多年前，胡雪岩家的窗户上已安装了&lt;strong&gt;法国进口彩色无尘玻璃&lt;/strong&gt;。每块玻璃颜色各异，阳光穿透而过，五彩光影洒落在雕花木梁之上，中西合璧，美轮美奂。而彼时，大多数中国百姓的窗户，还是用手一捅就破的窗户纸。&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;叁 · 细节里的富贵&lt;a href=&quot;#叁--细节里的富贵&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;🏯 御风楼 · 当时杭州最高民宅&lt;/p&gt;&lt;p&gt;足足 &lt;strong&gt;9米&lt;/strong&gt;，比当时故宫还高。登上御风楼，左眺西湖，右望钱塘江，尽揽杭州山水。这是胡雪岩俯瞰世界的眼。&lt;/p&gt;&lt;p&gt;💎 十万两白银的”寿”字太湖石&lt;/p&gt;&lt;p&gt;园中最贵的石头，形似大写”寿”字，购入价高达&lt;strong&gt;十万两白银&lt;/strong&gt;。对富贵之人而言，健康长寿，永远是无价之物。&lt;/p&gt;&lt;p&gt;🎭 私家戏台 · 把明星请回家&lt;/p&gt;&lt;p&gt;园内专设戏台，想听戏时把戏班请到家里——就像如今把明星接到客厅给你唱卡拉OK，对面御风楼是最佳观演位。&lt;/p&gt;&lt;p&gt;🔧 黄铜排水管 · 肥水不流外人田&lt;/p&gt;&lt;p&gt;天落雨水经全铜管道导入黄铜大缸，一为节水”肥水不流外人田”，二作消防——木质结构的宅院，缸中之水是最后一道防线。&lt;/p&gt;&lt;p&gt;🍳 七星灶 · 百平大厨房&lt;/p&gt;&lt;p&gt;七口锅并排而列，大炒小温各司其职，名曰”七星灶”。厨师就住在厨房一墙之隔，东家深夜想吃夜宵，隔墙喊一声即可。&lt;/p&gt;&lt;p&gt;📞 一百年前的”内线电话”&lt;/p&gt;&lt;p&gt;姨太太院与下人住所之间安装传声筒，胡雪岩深夜一句话，下人立刻行动。这是一百年前最私密的”内网通话系统”。&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;肆 · 7.6㎡的地窖，藏着一个时代&lt;a href=&quot;#肆--76的地窖藏着一个时代&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;旧居深处，一处楼梯通向地下——那是一间仅有 &lt;strong&gt;7.6 平方米&lt;/strong&gt; 的地窖，据说储存着胡雪岩的黄金与机密财物。整个旧居最华贵的楠木厅，与这间逼仄的地窖，构成了财富最真实的两面：明处的炫耀，与暗处的戒备。&lt;/p&gt;&lt;p&gt;— 关于这个男人 —&lt;/p&gt;&lt;p&gt;&lt;strong&gt;胡雪岩（1823—1885）&lt;/strong&gt;，原名胡光墉。幼年家贫，以放牛为生。凭借过人胆识，从钱庄学徒起步，借助官场人脉，开钱庄、办药铺、做军火，一步步成为大清帝国唯一被赐穿黄马褂的商人——&lt;strong&gt;红顶商人&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;长得据说与演曹操的那位明星颇为神似。&lt;/p&gt;&lt;p&gt;· · · · · ·&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;伍 · 一个放牛郎的天花板&lt;a href=&quot;#伍--一个放牛郎的天花板&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;法国玻璃、金丝楠木、十几吨黄铜、价值十万两的太湖石……一个出身贫苦的放牛郎，最终在杭州留下了这片令人叹为观止的宅院。每一个细节，都是他那个时代对”极致”二字的最大努力。&lt;/p&gt;&lt;p&gt;胡雪岩的发家之道，是一部值得细细品味的商业传奇。如果你也好奇，那就先去杭州，推开那扇”手握乾坤”的大门，从一砖一木中感受他的故事。&lt;/p&gt;&lt;p&gt;— 写在最后 —&lt;/p&gt;&lt;p&gt;来杭州旅游，别只去西湖断桥，&lt;br /&gt;
去胡雪岩旧居走一走，&lt;br /&gt;
感受一下，一个普通人可以走到多远的地方。&lt;br /&gt;
&lt;em&gt;关注我，下期为你解密胡雪岩的发家之道。&lt;/em&gt;&lt;/p&gt;&lt;p&gt;◆&lt;/p&gt;&lt;p&gt;— 历史 · 旅行篇 杭州 · 胡雪岩旧居&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>git指令学习</title><link>https://firefly.cuteleaf.cn/posts/git%E6%8C%87%E4%BB%A4%E5%AD%A6%E4%B9%A0/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/git%E6%8C%87%E4%BB%A4%E5%AD%A6%E4%B9%A0/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;Git 详细使用教程（命令行版，附命令作用解释）&lt;a href=&quot;#git-详细使用教程命令行版附命令作用解释&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;Git 是目前最流行的分布式版本控制系统，核心作用是&lt;strong&gt;跟踪文件变化、管理代码版本&lt;/strong&gt;，支持多人协作开发，可随时回滚到历史版本，避免代码丢失或冲突。本教程全程使用命令行操作（Windows 用 Git Bash、Mac/Linux 用终端），从基础配置到高级用法，逐一讲解命令作用和实操场景，新手可直接跟着步骤练习。&lt;/p&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;一、Git 前期准备（必做）&lt;a href=&quot;#一git-前期准备必做&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;1. 安装 Git&lt;a href=&quot;#1-安装-git&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;先在本地安装 Git，安装完成后，打开命令行，输入以下命令验证是否安装成功：&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git --version&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用：查看当前 Git 版本，若输出类似&lt;code&gt;git version 2\.43\.0&lt;/code&gt;，说明安装成功；若提示“命令不存在”，需重新安装 Git。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;2. 初始配置（绑定身份，关键步骤）&lt;a href=&quot;#2-初始配置绑定身份关键步骤&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Git 每次提交代码时，会记录提交者的身份（用户名和邮箱），用于区分不同开发者，必须配置后才能正常提交代码。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 配置用户名（建议和 GitHub/GitLab 用户名一致）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --global user.name &quot;你的用户名&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 配置邮箱（建议和 GitHub/GitLab 绑定邮箱一致）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --global user.email &quot;你的邮箱地址&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git config&lt;/code&gt;：Git 的配置命令，用于设置 Git 相关参数；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\-\-global&lt;/code&gt;：全局参数，意味着该配置在当前电脑所有 Git 项目中生效（若只想针对单个项目配置，去掉该参数，进入项目后再执行）；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;user\.name&lt;/code&gt;/&lt;code&gt;user\.email&lt;/code&gt;：配置提交者的用户名和邮箱，后续所有提交记录都会显示该信息。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;验证配置是否成功：&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git config --list&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用：查看当前 Git 的所有配置，若能看到刚才设置的用户名和邮箱，即为配置成功。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;二、Git 核心概念（先理解，再操作）&lt;a href=&quot;#二git-核心概念先理解再操作&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;在使用命令前，先明确 3 个核心工作区域，避免操作混乱：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;工作区（Working Directory）&lt;/strong&gt;：就是你本地电脑上的项目文件夹，你直接修改的文件都在这个区域；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;暂存区（Stage/Index）&lt;/strong&gt;：临时存放你修改的文件，相当于“缓存区”，用于确认哪些修改需要提交到版本库；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;版本库（Repository）&lt;/strong&gt;：Git 真正保存版本的地方，存放所有提交记录，可随时回滚到任意历史版本（分为本地版本库和远程版本库，如 GitHub）。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;核心流程：工作区修改 → 提交到暂存区 → 提交到本地版本库 → 推送到远程版本库（如 GitHub）。&lt;/p&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;三、本地仓库操作（最基础，必练）&lt;a href=&quot;#三本地仓库操作最基础必练&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;本地仓库是 Git 操作的基础，无需联网，可独立完成版本管理，适合个人开发或离线工作。&lt;/p&gt;&lt;section&gt;&lt;h2&gt;1. 初始化本地仓库（创建新项目）&lt;a href=&quot;#1-初始化本地仓库创建新项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：新建一个项目，想要用 Git 管理版本（比如本地新建的文件夹，需要变成 Git 仓库）。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 1. 进入你要管理的项目文件夹（先切换到目标路径）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;cd 你的项目文件夹路径（如：cd /Users/xxx/Documents/MyProject）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 2. 初始化 Git 仓库&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git init&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;cd&lt;/code&gt;：切换目录命令，用于进入你要操作的项目文件夹（若路径错误，会提示“没有该文件或目录”）；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;git init&lt;/code&gt;：初始化 Git 仓库，执行后会在项目文件夹中生成一个隐藏的 &lt;code&gt;\.git&lt;/code&gt; 文件夹（该文件夹是 Git 版本库的核心，不要删除），此时项目就被 Git 管理起来了。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;注意：每个项目只需初始化一次，初始化后，该文件夹就是 Git 仓库了。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;2. 查看工作区状态（高频命令）&lt;a href=&quot;#2-查看工作区状态高频命令&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;无论做什么操作，建议先查看工作区状态，确认当前文件的修改情况，避免误操作。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git status&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用：查看工作区、暂存区的文件状态，常见输出场景：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;未修改：提示 &lt;code&gt;nothing to commit, working tree clean&lt;/code&gt;（工作区干净，没有任何修改）；&lt;/li&gt;
&lt;li&gt;已修改但未提交到暂存区：文件名称显示为 &lt;code&gt;modified&lt;/code&gt;（红色）；&lt;/li&gt;
&lt;li&gt;已提交到暂存区但未提交到版本库：文件名称显示为 &lt;code&gt;staged&lt;/code&gt;（绿色）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;3. 将修改的文件提交到暂存区&lt;a href=&quot;#3-将修改的文件提交到暂存区&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：你在工作区修改了文件（如新增、修改、删除文件），需要先提交到暂存区，再准备提交到版本库。&lt;/p&gt;&lt;p&gt;Terminal window收起&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式1：提交所有修改的文件（最常用）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git add .&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式2：提交指定文件（适用于只提交部分修改）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git add 文件名（如：git add index.html）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式3：提交指定文件夹下的所有文件&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git add 文件夹名（如：git add src/）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;收起&lt;/p&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git add&lt;/code&gt;：将工作区的修改“暂存”起来，告诉 Git“这些修改我要提交到版本库，请先记录下来”；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\.&lt;/code&gt;：表示当前目录下所有修改的文件（包括新增、修改、删除），简化操作，无需逐个指定文件；&lt;/li&gt;
&lt;li&gt;提交后，再执行&lt;code&gt;git status&lt;/code&gt;，会看到文件变成绿色，提示“changes to be committed”（暂存区有等待提交的内容）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;4. 将暂存区的文件提交到本地版本库&lt;a href=&quot;#4-将暂存区的文件提交到本地版本库&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;这是 Git 版本管理的核心步骤，提交后，修改会被永久保存到本地版本库，生成一条新的版本记录。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git commit -m &quot;提交说明&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git commit&lt;/code&gt;：将暂存区的内容提交到本地版本库，完成一次版本更新；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\-m \&amp;amp;\#34;提交说明\&amp;amp;\#34;&lt;/code&gt;：必填参数，用于描述本次提交的内容（如“新增登录页面”“修复首页轮播bug”），建议说明清晰，方便后续查看历史记录时，快速知道该版本做了什么修改；&lt;/li&gt;
&lt;li&gt;提交成功后，会提示类似 &lt;code&gt;1 file changed, 2 insertions\(\+\)&lt;/code&gt; 的信息，表示“1个文件被修改，新增了2行内容”。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;注意：必须先执行 &lt;code&gt;git add&lt;/code&gt;，再执行 &lt;code&gt;git commit&lt;/code&gt;，否则会提示“没有可提交的内容”。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;5. 查看提交历史记录&lt;a href=&quot;#5-查看提交历史记录&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：查看之前的提交记录，包括提交者、提交时间、提交说明、版本号（用于回滚版本）。&lt;/p&gt;&lt;p&gt;Terminal window收起&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式1：查看完整历史记录（详细）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git log&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式2：查看简洁历史记录（只显示版本号和提交说明，推荐）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git log --oneline&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式3：查看所有提交记录（包括回滚的记录）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git reflog&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;收起&lt;/p&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git log&lt;/code&gt;：显示所有提交记录，每条记录包含版本号（40位哈希值）、提交者、提交时间、提交说明；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\-\-oneline&lt;/code&gt;：简化输出，每条记录只显示前7位版本号和提交说明，更易查看；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;git reflog&lt;/code&gt;：比 &lt;code&gt;git log&lt;/code&gt; 更全面，会记录所有操作（包括回滚、撤销提交），常用于找回误删的版本。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;6. 版本回滚（恢复到历史版本）&lt;a href=&quot;#6-版本回滚恢复到历史版本&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：修改出错、代码丢失，需要恢复到之前的某个稳定版本（核心操作，务必掌握）。&lt;/p&gt;&lt;p&gt;Terminal window收起&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 第一步：查看历史版本，获取要回滚的版本号（前7位即可）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git log --oneline&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 第二步：回滚到指定版本（两种常用方式）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式1：彻底回滚，删除回滚版本之后的所有提交记录（谨慎使用，适合个人开发）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git reset --hard 版本号（如：git reset --hard a1b2c3d）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式2：安全回滚，保留回滚版本之后的修改（推荐，适合多人协作）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git revert 版本号（如：git revert a1b2c3d）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;收起&lt;/p&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git reset \-\-hard 版本号&lt;/code&gt;：强制回滚到指定版本，工作区、暂存区的内容都会同步到该版本，之后的提交记录会被删除（无法恢复，谨慎使用）；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;git revert 版本号&lt;/code&gt;：不会删除任何提交记录，而是生成一条新的提交记录，将代码恢复到指定版本，后续的修改仍然保留（安全，多人协作时优先使用）；&lt;/li&gt;
&lt;li&gt;版本号：通过 &lt;code&gt;git log \-\-oneline&lt;/code&gt; 获取，如 &lt;code&gt;a1b2c3d&lt;/code&gt;（前7位即可，Git 会自动识别）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;7. 撤销工作区的修改（未提交到暂存区）&lt;a href=&quot;#7-撤销工作区的修改未提交到暂存区&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：在工作区修改了文件，但还没执行 &lt;code&gt;git add&lt;/code&gt;，想放弃修改，恢复到上一次提交后的状态。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 撤销单个文件的修改&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git checkout -- 文件名（如：git checkout -- index.html）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 撤销所有工作区的修改（未 add 的）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git checkout .&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;命令作用：放弃工作区的所有未暂存修改，将文件恢复到最近一次 &lt;code&gt;git commit&lt;/code&gt; 或 &lt;code&gt;git add&lt;/code&gt; 后的状态（注意：撤销后，修改会彻底丢失，无法恢复）。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;8. 撤销暂存区的修改（已 add 但未 commit）&lt;a href=&quot;#8-撤销暂存区的修改已-add-但未-commit&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：执行了 &lt;code&gt;git add&lt;/code&gt;，将修改提交到了暂存区，但还没执行 &lt;code&gt;git commit&lt;/code&gt;，想撤销暂存，重新修改。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git reset HEAD 文件名（如：git reset HEAD index.html）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 撤销所有暂存区的修改&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git reset HEAD .&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用：将暂存区的修改撤销回工作区，此时文件状态会从“绿色（staged）”变回“红色（modified）”，之后可以重新修改、重新 add。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;四、远程仓库操作（多人协作必备）&lt;a href=&quot;#四远程仓库操作多人协作必备&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;远程仓库（如 GitHub、GitLab、Gitee）是用于多人共享代码的服务器，本地仓库的代码可以推送到远程，也可以从远程拉取别人的代码，实现协作开发。&lt;/p&gt;&lt;p&gt;前提：你已经有一个远程仓库（如在 GitHub 上创建了仓库），且本地 Git 已配置好远程仓库地址。&lt;/p&gt;&lt;section&gt;&lt;h2&gt;1. 关联远程仓库（第一次绑定）&lt;a href=&quot;#1-关联远程仓库第一次绑定&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：本地已有 Git 仓库，想要和远程仓库绑定，实现代码同步。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git remote add origin 远程仓库地址&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git remote&lt;/code&gt;：用于管理远程仓库的命令（如添加、删除、查看远程仓库）；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;add&lt;/code&gt;：添加远程仓库；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;origin&lt;/code&gt;：远程仓库的别名（默认用 origin，可自定义，如 git remote add github 远程地址），后续操作远程仓库时，用别名即可，无需输入完整地址；&lt;/li&gt;
&lt;li&gt;远程仓库地址：从 GitHub/GitLab 复制，一般分为 HTTPS 和 SSH 两种（HTTPS 无需配置密钥，直接输入账号密码即可；SSH 需要配置密钥，无需每次输入账号密码，推荐长期使用）。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;查看已关联的远程仓库：&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git remote -v&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用：查看当前本地仓库关联的所有远程仓库，输出会显示远程仓库的别名、地址，以及可进行的操作（fetch：拉取，push：推送）。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;2. 从远程仓库拉取代码（同步别人的修改）&lt;a href=&quot;#2-从远程仓库拉取代码同步别人的修改&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：多人协作时，别人将代码推送到了远程仓库，你需要将远程的最新代码拉取到本地，保持本地和远程同步。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式1：拉取远程默认分支（如 main/master）的最新代码（最常用）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git pull origin main（或 master，取决于远程仓库的默认分支名）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式2：拉取远程指定分支的代码&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git pull origin 分支名（如：git pull origin develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git pull&lt;/code&gt;：等价于 &lt;code&gt;git fetch \+ git merge&lt;/code&gt;，即先从远程拉取最新代码到本地临时区域，再自动合并到当前本地分支；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;origin&lt;/code&gt;：远程仓库别名；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;main/master&lt;/code&gt;：远程仓库的默认分支（GitHub 现在默认分支是 main，旧版本是 master）；&lt;/li&gt;
&lt;li&gt;注意：拉取代码前，建议先执行 &lt;code&gt;git commit&lt;/code&gt;，将本地的修改提交到本地版本库，避免拉取时出现代码冲突。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;3. 将本地代码推送到远程仓库（分享自己的修改）&lt;a href=&quot;#3-将本地代码推送到远程仓库分享自己的修改&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：你在本地完成了代码修改（已 commit 到本地版本库），想要将修改推送到远程仓库，让别人看到你的代码。&lt;/p&gt;&lt;p&gt;Terminal window收起&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式1：推送本地默认分支到远程默认分支（第一次推送需加 -u）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 第一次推送（绑定本地分支和远程分支，后续可直接用 git push）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push -u origin main（或 master）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 后续推送（已绑定分支，无需加 -u）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push origin main（或 master）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 方式2：推送本地指定分支到远程指定分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push origin 本地分支名:远程分支名（如：git push origin develop:develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;收起&lt;/p&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git push&lt;/code&gt;：将本地版本库的提交记录推送到远程仓库；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\-u&lt;/code&gt;：第一次推送时使用，用于绑定本地分支和远程分支（如本地 main 分支绑定远程 main 分支），后续推送时，直接输入 &lt;code&gt;git push&lt;/code&gt; 即可，无需指定别名和分支；&lt;/li&gt;
&lt;li&gt;推送失败常见原因：① 本地代码不是最新的（需先 &lt;code&gt;git pull&lt;/code&gt; 拉取远程最新代码，解决冲突后再推送）；② 没有远程仓库的权限（检查账号密码或 SSH 密钥配置）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;4. 克隆远程仓库到本地（第一次下载）&lt;a href=&quot;#4-克隆远程仓库到本地第一次下载&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：本地没有该项目，直接从远程仓库下载完整的项目代码（包括所有版本记录）。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git clone 远程仓库地址&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git clone&lt;/code&gt;：将远程仓库的所有内容（包括代码、版本记录、分支）完整下载到本地，自动创建项目文件夹，并初始化 Git 仓库；&lt;/li&gt;
&lt;li&gt;执行后，本地会自动关联该远程仓库（别名默认是 origin），无需再执行 &lt;code&gt;git remote add&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;示例：&lt;code&gt;git clone https://github\.com/用户名/项目名\.git&lt;/code&gt;（HTTPS 地址），或 &lt;code&gt;git clone git@github\.com:用户名/项目名\.git&lt;/code&gt;（SSH 地址）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;5. 查看远程分支&lt;a href=&quot;#5-查看远程分支&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Terminal window收起&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 查看本地所有分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 查看远程所有分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch -r&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 查看本地和远程所有分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch -a&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;收起&lt;/p&gt;&lt;p&gt;命令作用：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git branch&lt;/code&gt;：查看本地已有的分支，当前所在分支会用 &lt;code&gt;\*&lt;/code&gt; 标记；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\-r&lt;/code&gt;：查看远程仓库的所有分支；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;\-a&lt;/code&gt;：查看本地和远程的所有分支（远程分支会显示为 &lt;code&gt;remotes/origin/分支名&lt;/code&gt;）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;6. 切换/创建分支（多人协作核心）&lt;a href=&quot;#6-切换创建分支多人协作核心&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;多人协作时，建议每人在自己的分支上开发，避免直接修改默认分支（main/master），开发完成后再合并到默认分支。&lt;/p&gt;&lt;p&gt;Terminal window展开&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 1. 创建新分支（并切换到该分支，最常用）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git checkout -b 分支名（如：git checkout -b develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 等价于以下两条命令：&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# git branch 分支名（创建分支）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# git checkout 分支名（切换到该分支）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;30&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;31&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 2. 切换到已有的本地分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;32&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;33&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;34&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;35&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;36&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git checkout 分支名（如：git checkout main）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;37&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;38&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;39&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;40&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;41&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 3. 切换到远程分支（并创建本地对应分支）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;42&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;43&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;44&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;45&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;46&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git checkout -b 本地分支名 origin/远程分支名（如：git checkout -b develop origin/develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;展开&lt;/p&gt;&lt;p&gt;命令作用详解：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git checkout \-b 分支名&lt;/code&gt;：一次性完成“创建分支+切换分支”，高效便捷；&lt;/li&gt;
&lt;li&gt;分支命名建议：按功能命名（如 &lt;code&gt;feature/login&lt;/code&gt;，表示登录功能分支）、按bug修复命名（如 &lt;code&gt;fix/banner\-bug&lt;/code&gt;），便于区分。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;7. 合并分支（将开发分支的代码合并到默认分支）&lt;a href=&quot;#7-合并分支将开发分支的代码合并到默认分支&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;适用于：在开发分支（如 develop）完成开发后，将代码合并到默认分支（如 main），让修改生效。&lt;/p&gt;&lt;p&gt;Terminal window&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 1. 先切换到要合并到的目标分支（如 main 分支）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git checkout main&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 2. 合并开发分支（如 develop 分支）到当前分支（main）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git merge develop&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;命令作用：将指定分支（如 develop）的所有修改，合并到当前所在的分支（如 main），合并后，main 分支就包含了 develop 分支的所有代码。&lt;/p&gt;&lt;p&gt;注意：合并时可能会出现&lt;strong&gt;代码冲突&lt;/strong&gt;（如两个人同时修改了同一个文件的同一行），此时需要手动解决冲突：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;执行 &lt;code&gt;git merge&lt;/code&gt; 后，Git 会提示“冲突文件”；&lt;/li&gt;
&lt;li&gt;打开冲突文件，找到标记冲突的地方（用 &lt;code&gt;\&amp;lt;\&amp;lt;\&amp;lt;\&amp;lt;\&amp;lt;\&amp;lt;\&amp;lt;&lt;/code&gt;、&lt;code&gt;=======&lt;/code&gt;、&lt;code&gt;\&amp;gt;\&amp;gt;\&amp;gt;\&amp;gt;\&amp;gt;\&amp;gt;\&amp;gt;&lt;/code&gt; 标记）；&lt;/li&gt;
&lt;li&gt;修改冲突内容（保留需要的代码，删除冲突标记）；&lt;/li&gt;
&lt;li&gt;执行 &lt;code&gt;git add \.&lt;/code&gt; 和 &lt;code&gt;git commit \-m \&amp;amp;\#34;解决合并冲突\&amp;amp;\#34;&lt;/code&gt;，完成合并。&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;8. 删除分支（分支开发完成后）&lt;a href=&quot;#8-删除分支分支开发完成后&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Terminal window收起&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 删除本地分支（分支已合并到主分支，可安全删除）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch -d 分支名（如：git branch -d develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 强制删除本地分支（分支未合并，强行删除，谨慎使用）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch -D 分支名&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 删除远程分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;30&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;31&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;32&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;33&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;34&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push origin --delete 分支名（如：git push origin --delete develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;收起&lt;/p&gt;&lt;p&gt;命令作用：删除无用的分支，保持分支结构清晰，避免混乱。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;五、常用补充命令（高频实用）&lt;a href=&quot;#五常用补充命令高频实用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;Terminal window展开&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 1. 查看当前分支的提交差异（对比工作区和暂存区）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git diff&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 2. 查看暂存区和本地版本库的差异&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git diff --cached&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 3. 查看两个分支之间的差异&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git diff 分支1 分支2（如：git diff main develop）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;30&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;31&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;32&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;33&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;34&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;35&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 4. 暂存当前修改，切换到其他分支（临时切换分支，不提交当前修改）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;36&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;37&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;38&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;39&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;40&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git stash  # 暂存当前修改&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;41&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;42&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;43&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;44&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;45&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git stash pop  # 恢复暂存的修改（恢复后，暂存记录删除）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;46&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;47&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;48&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;49&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;50&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git stash list  # 查看所有暂存记录&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;51&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;52&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;53&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;54&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;55&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;56&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;57&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;58&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;59&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;60&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;61&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 5. 重命名本地分支&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;62&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;63&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;64&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;65&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;66&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch -m 旧分支名 新分支名&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;67&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;68&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;69&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;70&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;71&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;72&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;73&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;74&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;75&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;76&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;77&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 6. 更新远程分支列表（远程删除了分支，本地同步）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;78&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;79&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;80&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;81&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;82&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git fetch --prune&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;展开&lt;/p&gt;&lt;p&gt;每个命令的作用简要说明：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;git diff&lt;/code&gt;：快速查看修改的具体内容（哪一行被修改、新增/删除了什么）；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;git stash&lt;/code&gt;：临时保存未提交的修改，常用于“正在开发一个功能，突然需要切换到其他分支修复bug”的场景；&lt;/li&gt;
&lt;li&gt;&lt;code&gt;git fetch \-\-prune&lt;/code&gt;：同步远程分支的删除操作，避免本地显示已删除的远程分支。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;六、常见问题解决（新手必看）&lt;a href=&quot;#六常见问题解决新手必看&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;1. 拉取/推送代码时，提示“权限不足”&lt;a href=&quot;#1-拉取推送代码时提示权限不足&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;原因：未配置正确的账号密码或 SSH 密钥。&lt;/p&gt;&lt;p&gt;解决方法：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;若用 HTTPS 地址：重新输入正确的 GitHub/GitLab 账号密码；&lt;/li&gt;
&lt;li&gt;若用 SSH 地址：配置 SSH 密钥（网上搜索“GitHub SSH 密钥配置”，按步骤操作即可，配置一次终身可用）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;2. 合并分支时出现代码冲突&lt;a href=&quot;#2-合并分支时出现代码冲突&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;解决方法：按前面“合并分支”部分的步骤，手动修改冲突文件，删除冲突标记，保留需要的代码，再提交即可。&lt;/p&gt;&lt;p&gt;注意：冲突解决后，一定要仔细检查代码，确保没有误删有用的内容。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;3. 误删本地代码/误回滚版本，如何恢复？&lt;a href=&quot;#3-误删本地代码误回滚版本如何恢复&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;解决方法：执行 &lt;code&gt;git reflog&lt;/code&gt;，查看所有操作记录，找到误删/误回滚前的版本号，再执行&lt;code&gt;git reset \-\-hard 版本号&lt;/code&gt;，即可恢复到该版本。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;4. 推送代码时，提示“本地版本落后于远程版本”&lt;a href=&quot;#4-推送代码时提示本地版本落后于远程版本&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;原因：远程仓库有别人推送的最新代码，你的本地代码不是最新的，无法直接推送。&lt;/p&gt;&lt;p&gt;解决方法：先执行 &lt;code&gt;git pull&lt;/code&gt; 拉取远程最新代码，解决冲突后，再执行 &lt;code&gt;git push&lt;/code&gt;。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;七、总结（核心流程梳理）&lt;a href=&quot;#七总结核心流程梳理&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;Git 的核心操作围绕“本地仓库”和“远程仓库”展开，新手记住以下流程即可快速上手：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;前期准备：安装 Git → 配置用户名和邮箱；&lt;/li&gt;
&lt;li&gt;本地开发：初始化仓库（git init）→ 修改文件 → 提交到暂存区（git add .）→ 提交到本地版本库（git commit -m “说明”）；&lt;/li&gt;
&lt;li&gt;多人协作：克隆远程仓库（git clone）→ 拉取远程更新（git pull）→ 创建分支开发 → 推送分支到远程（git push）→ 合并分支；&lt;/li&gt;
&lt;li&gt;问题处理：版本回滚（git reset/git revert）、解决冲突、恢复误删代码（git reflog）。&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;Git 命令看似多，但常用的只有十几个，多练习几次（比如新建一个测试项目，反复执行 add、commit、push、pull 等操作），就能熟练掌握。记住：所有命令的核心都是“跟踪版本、同步代码”，理解每个命令的作用，比死记硬背更重要。&lt;/p&gt;&lt;/section&gt;</content:encoded></item><item><title>上传失败</title><link>https://firefly.cuteleaf.cn/posts/%E4%B8%8A%E4%BC%A0%E5%A4%B1%E8%B4%A5%E5%8F%AF%E5%88%87%E6%8D%A2ssh/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E4%B8%8A%E4%BC%A0%E5%A4%B1%E8%B4%A5%E5%8F%AF%E5%88%87%E6%8D%A2ssh/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h3&gt;💡 建议操作流&lt;a href=&quot;#-建议操作流&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;问题原因&lt;a href=&quot;#问题原因&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;连接超时&lt;/strong&gt;：网络问题，连不上 GitHub 443 端口&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;提示输入用户名&lt;/strong&gt;：你用的是 HTTPS 方式，现在 GitHub 已经&lt;strong&gt;不支持密码登录&lt;/strong&gt;了&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;一步到位解决方案（最简单）&lt;a href=&quot;#一步到位解决方案最简单&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;1. 先把远程仓库改成 SSH（彻底解决权限 + 网络问题）&lt;a href=&quot;#1-先把远程仓库改成-ssh彻底解决权限--网络问题&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;运行这条命令：&lt;/p&gt;&lt;p&gt;运行&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git remote set-url origin git@github.com:yzg011/astro.git&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;2. 再推送&lt;a href=&quot;#2-再推送&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;运行&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push -u origin main&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>上传指令</title><link>https://firefly.cuteleaf.cn/posts/%E4%B8%8A%E4%BC%A0%E6%8C%87%E4%BB%A4/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E4%B8%8A%E4%BC%A0%E6%8C%87%E4%BB%A4/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h3&gt;💡 建议操作流&lt;a href=&quot;#-建议操作流&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;对于 Astro 项目首次上传，标准流程如下：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 1. 确保所有文件被添加&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git add .&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 2. 提交变更（如果有变更）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git commit -m &quot;Initial commit&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 3. 重命名分支为 main（与 GitHub 默认一致）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git branch -M main&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 4. 推送到远程&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git push -u origin main&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;</content:encoded></item><item><title>刘邦与项羽：一个实用帝王与一个悲剧英雄的千年对决</title><link>https://firefly.cuteleaf.cn/posts/%E5%88%98%E9%82%A6/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E5%88%98%E9%82%A6/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;刘邦与项羽：一个实用帝王与一个悲剧英雄的千年对决&lt;/p&gt;
&lt;p&gt;漢&lt;/p&gt;
&lt;p&gt;中国历史人物&lt;/p&gt;
&lt;section&gt;&lt;h1&gt;&lt;/h1&gt;&lt;p&gt;刘邦 vs 项羽&lt;/p&gt;&lt;section&gt;&lt;h2&gt;&lt;a href=&quot;#-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;一个实用帝王 · 一个悲剧英雄&lt;/p&gt;&lt;p&gt;从泗水亭长到汉朝开国皇帝&lt;br /&gt;
从西楚霸王到乌江自刎——&lt;/p&gt;&lt;p&gt;一个是含着金汤匙出生的贵族才俊，力拔山河气盖世；一个是喝酒打架没正事儿的中年农民老流氓，好吃懒做的混子。然而最终，前者成了千年传诵的悲剧英雄，后者成了缔造四百年汉朝的实用帝王。&lt;/p&gt;&lt;p&gt;壹&lt;/p&gt;&lt;section&gt;&lt;h3&gt;草根混子 vs 贵族才俊&lt;a href=&quot;#草根混子-vs-贵族才俊&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;刘邦出生在江苏沛县的一个小村庄，爸妈没什么文化，连个正经名字都没给起。兄弟四个，他排行老三，干脆叫”刘季”——有排行最小的意思。打小就跟别人不一样，不爱种地干活，一天到晚斗鸡走犬，广交狐朋狗友，十里八乡谁都能跟他玩到一块儿。&lt;/p&gt;&lt;p&gt;连亲爹都瞧不上他，说他不如哥哥。嫂子也烦他，因为他经常把朋友叫到家里吃喝吹牛。可刘邦不在乎，反正在家也不受待见，拍拍屁股就跑去偶像张耳家里混吃混喝，脸皮厚，一住就是小半年。&lt;/p&gt;&lt;p&gt;刘邦&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;📍 沛县草根农民&lt;/li&gt;
&lt;li&gt;🎂 48岁才开始创业&lt;/li&gt;
&lt;li&gt;🍖 好吃懒做的混子&lt;/li&gt;
&lt;li&gt;💡 能屈能伸 实用为王&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;项羽&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;📍 楚国名将世家后代&lt;/li&gt;
&lt;li&gt;💪 身高184，力能举鼎&lt;/li&gt;
&lt;li&gt;⚔️ 23岁登上历史舞台&lt;/li&gt;
&lt;li&gt;🏆 百战百胜 天纵奇才&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;项羽则截然不同，他是含着金汤匙出生的，项家是楚国名将世家。即使后来秦国把楚国灭了，家道中落，他依然游走在上层圈子里——身高184，力能举鼎，才气过人。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;贰&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;同一个始皇帝，两种不同的心&lt;a href=&quot;#同一个始皇帝两种不同的心&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;31岁的刘邦备考两年后考上公务员，当上了泗水亭长，相当于乡镇派出所所长。有一次去咸阳出差，正巧赶上秦始皇出巡的队伍。所有百姓官员都跪在地上，山呼万岁，刘邦也跪于其中，远远地看着那豪华威严的仪仗，不禁感慨：&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;大丈夫就应该是这样的！&lt;/p&gt;&lt;p&gt;—— 刘邦，向往&lt;/p&gt;&lt;p&gt;而远在会稽的项羽，同样也看着秦始皇庞大的船队和仪仗，却对叔叔说了完全不同的话：&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;以后我必定取而代之！&lt;/p&gt;&lt;p&gt;—— 项羽，复仇&lt;/p&gt;&lt;p&gt;一个是草根老百姓的向往羡慕，一个是秦朝让家族没落的气愤复仇。同一个背景，两种截然不同的心理，也预示着两人截然不同的命运走向。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;叁&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;40岁娶妻，48岁造反创业&lt;a href=&quot;#40岁娶妻48岁造反创业&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;刘邦人生的转折点，是在一场饭局上。当地来了个姓吕的老头儿，附近有头有脸的人都来拜访。宴会主持人萧何通知说，凡是贺礼不到一千钱的，只能在大堂，进不了包间。刘邦心想，来都来了，肯定要近距离接触。当即大声说：&lt;/p&gt;&lt;p&gt;“我刘季给吕公送礼一万钱！“——实际上兜里比脸还干净，一个字儿都没有，说起谎来脸不红心不跳。&lt;/p&gt;&lt;p&gt;没想到吕老头会看面相，一见刘邦就觉得此人前途不可限量，宴会一结束就拉着他的手说：“我擅长面相，见过了那么多人，没有一个面相比得上您，我有个女儿，您要是还没娶媳妇儿，就让她嫁给您吧。”&lt;/p&gt;&lt;p&gt;40岁的刘邦以为自己听错了。这位吕老头的女儿，正是日后与武则天、慈禧并称”中国历史三大女主”的吕雉。&lt;/p&gt;&lt;p&gt;📅 刘邦的人生时间线&lt;/p&gt;&lt;p&gt;31岁 — 考上泗水亭长（相当于乡镇所长）&lt;/p&gt;&lt;p&gt;40岁 — 骗吃骗喝，娶了年轻貌美的媳妇吕雉&lt;/p&gt;&lt;p&gt;约42岁 — 押送犯人，被逼上梁山，躲进芒砀山造反&lt;/p&gt;&lt;p&gt;48岁 — 趁乱起兵，开启真正的创业之路&lt;/p&gt;&lt;p&gt;54岁 — 称帝，建立大汉王朝&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;肆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;史上最惊险的饭局——鸿门宴&lt;a href=&quot;#史上最惊险的饭局鸿门宴&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;先入关中的是刘邦，而不是项羽。这让项羽大怒。谋士范增说：“这个姓刘的不能留，必成心腹大患，找机会弄死他。“两人达成一致。&lt;/p&gt;&lt;p&gt;消息传到刘邦耳中，他第二天一早带着100号人赶到鸿门给项羽请罪，还没走近，远远就行礼，说自己无意争风，退出咸阳就是等着项大将军来当主人。项羽是个顺毛驴，果不其然，一听这话，反而觉得对不住刘邦了，当场摆下酒宴给刘邦压惊。&lt;/p&gt;&lt;p&gt;⚔ 鸿门宴局中局 ⚔&lt;/p&gt;&lt;p&gt;项羽阵营&lt;/p&gt;&lt;p&gt;项羽 — 主帅（不想杀）&lt;/p&gt;&lt;p&gt;范增 — 谋士（要杀刘邦）&lt;/p&gt;&lt;p&gt;项伯 — 叔叔（暗中保护）&lt;/p&gt;&lt;p&gt;项庄 — 舞剑刺客（未果）&lt;/p&gt;&lt;p&gt;刘邦阵营&lt;/p&gt;&lt;p&gt;刘邦 — 主角（能屈能伸）&lt;/p&gt;&lt;p&gt;张良 — 谋士（运筹帷幄）&lt;/p&gt;&lt;p&gt;樊哙 — 武将（闯帐解围）&lt;/p&gt;&lt;p&gt;刘邦 — 借口上厕所逃走&lt;/p&gt;&lt;p&gt;范增精心策划的暗杀在项伯和樊哙的干扰下彻底失败。樊哙闯入大帐后说的话才是真正的转折点：先给刘邦戴高帽，再给项羽扣上”跟秦王没什么两样”的大帽子，然后轻描淡写地说”我觉得您肯定不是那种人”。粗野武夫说出来的话竟无懈可击。&lt;/p&gt;&lt;p&gt;最终，刘邦借口上厕所，溜之大吉。范增气得牙痒痒：“你看吧，夺天下的一定是刘邦了，咱们这些人都要成为他的俘虏啦！”&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;伍&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;韩信出山，楚汉争霸&lt;a href=&quot;#韩信出山楚汉争霸&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;就在刘邦愁着如何翻盘时，一个人才跳槽来投——韩信。此前，韩信在项羽手下是个保安队长，因为太爱给领导提建议，项羽烦了，韩信就跳槽去了刘邦这个偏远小公司，直接被封为大将军。&lt;/p&gt;&lt;p&gt;🔥 韩信的妙计：明修栈道，暗度陈仓&lt;/p&gt;&lt;p&gt;表面上让你看到我不争不抢，实际上暗中行动达成目标。仅仅一年，韩信合并五路诸侯，率56万大军攻下项羽老巢彭城。&lt;/p&gt;&lt;p&gt;然而项羽毕竟是项羽。一听家被偷了，果断掉头，仅率3万轻骑兵就将刘邦56万大军杀得分崩离析。刘邦疯狂逃窜，逃跑路上甚至把自己的儿女踹下车……连裤衩都赔掉了。&lt;/p&gt;&lt;p&gt;但刘邦不愧是刘邦——在家用离间计把项羽手下唯一拿得出手的谋士范增给离间走了。公元前203年，项羽兵疲粮尽，被迫签下楚河汉界协议。&lt;/p&gt;&lt;p&gt;等项羽转身回家，刘邦撕毁协议，率军追击，在垓下将项羽十面埋伏。项羽吃了人生中第一次败仗。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;陆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;霸王别姬，乌江自刎&lt;a href=&quot;#霸王别姬乌江自刎&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;这天夜里，黑暗中突然从四面八方传来楚国的歌声——四面楚歌。&lt;/p&gt;&lt;p&gt;此时的项羽睡不着，在大帐中喝着闷酒，看着身边虞姬美丽的脸庞，又看看自己穷途末路的处境，放声悲歌——&lt;/p&gt;&lt;p&gt;“力拔山兮气盖世，时不利兮骓不逝。&lt;br /&gt;
骓不逝兮可奈何，虞兮虞兮奈若何！”&lt;/p&gt;&lt;p&gt;虞姬泪流满面，举剑自刎。&lt;/p&gt;&lt;p&gt;随后，项羽翻身上马，带着800骑兵杀出重围。逃到乌江时，身边仅剩28骑。乌江亭长划着小船等候，说”大王，回江东还有机会”。&lt;/p&gt;&lt;p&gt;项羽摇头说：“当年我带着八千子弟出来打天下，现在只剩我一人，还有何颜面见江东父老？”&lt;/p&gt;&lt;p&gt;他笑着拒绝了渡江，转身面对追兵，拔剑自刎于乌江江畔。年仅31岁。&lt;/p&gt;&lt;p&gt;整本《史记》中，这是项羽第一次，也是最后一次笑。八千子弟兵无一生还，他做不到，也没法交代。宁可站着死，绝不跪着生。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;柒&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;刘邦最大的本事：用人&lt;a href=&quot;#刘邦最大的本事用人&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;称帝后，刘邦环顾手下的兄弟们，不禁感慨——这是一支多么草根的创业团队啊：&lt;/p&gt;&lt;p&gt;樊哙 · 武阳侯&lt;/p&gt;&lt;p&gt;老家卖狗肉的&lt;br /&gt;
→ 最勇猛的先锋&lt;/p&gt;&lt;p&gt;夏侯婴 · 汝阴侯&lt;/p&gt;&lt;p&gt;县长的车夫&lt;br /&gt;
→ 多次救主的司机&lt;/p&gt;&lt;p&gt;萧何 · 赞侯&lt;/p&gt;&lt;p&gt;老家同事&lt;br /&gt;
→ 最强后勤HR&lt;/p&gt;&lt;p&gt;曹参 · 平阳侯&lt;/p&gt;&lt;p&gt;老家监狱长&lt;br /&gt;
→ 开国功臣&lt;/p&gt;&lt;p&gt;韩信 · 楚王&lt;/p&gt;&lt;p&gt;项羽的保安队长&lt;br /&gt;
→ 兵仙，战神&lt;/p&gt;&lt;p&gt;张良 · 留侯&lt;/p&gt;&lt;p&gt;韩国落魄贵族&lt;br /&gt;
→ 最信任的谋士&lt;/p&gt;&lt;p&gt;这是时势造英雄，更是&lt;strong&gt;刘邦有容人之量，用人不疑&lt;/strong&gt;。一个卖狗肉的、一个车夫、一个监狱长、一个吹唢呐的……他把这些人用成了开国功勋。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;终&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;人生，从来没有太晚的开始&lt;a href=&quot;#人生从来没有太晚的开始&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;关于 项羽&lt;/p&gt;&lt;p&gt;你是史记中唯一一个不是帝王却被写入本纪的人。巨鹿之战，5万对40万，胜；彭城之战，3万对56万，胜。垓下一战，他们集结全明星阵容对你十面埋伏，还不敢硬上，只能用四面楚歌攻心。&lt;/p&gt;&lt;p&gt;有人说你要面子——可面对从小长大的地方，面对父老乡亲，又有几个人不想有个体面？你只是不想再连累江东的父兄了。宁可站着死，绝不跪着生。&lt;/p&gt;&lt;p&gt;生当作人杰，&lt;br /&gt;
死亦为鬼雄。&lt;/p&gt;&lt;p&gt;—— 李清照&lt;/p&gt;&lt;p&gt;关于 刘邦&lt;/p&gt;&lt;p&gt;一般人40岁就信命了，而你40岁骗吃骗喝娶了老婆，48岁开始创业，7年时间先灭强秦，再灭项羽，54岁称帝。&lt;/p&gt;&lt;p&gt;你是历史上从平民到帝王的第一人，王侯将相宁有种乎的真正践行者。就连后世都说：&lt;strong&gt;大丈夫当如是。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;历史或许不会重复，但人性的规律永存。&lt;/p&gt;&lt;p&gt;有人少年得志，有人大器晚成，&lt;br /&gt;
人生从来没有太晚的开始。&lt;/p&gt;&lt;p&gt;年龄，又能说明什么呢？&lt;/p&gt;&lt;p&gt;中国历史文化人物&lt;/p&gt;&lt;p&gt;在历史中寻找力量，在人物中看见自己&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>安装指令</title><link>https://firefly.cuteleaf.cn/posts/%E5%AE%89%E8%A3%85%E6%8C%87%E4%BB%A4/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E5%AE%89%E8%A3%85%E6%8C%87%E4%BB%A4/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;🚀 快速开始&lt;a href=&quot;#-快速开始&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;环境要求&lt;a href=&quot;#环境要求&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ul&gt;
&lt;li&gt;Node.js ≥ 22&lt;/li&gt;
&lt;li&gt;pnpm ≥ 9&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;本地开发部署&lt;a href=&quot;#本地开发部署&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;克隆仓库：&lt;/strong&gt;&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git clone https://github.com/Cuteleaf/Firefly.git&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;cd Firefly&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;p&gt;&lt;strong&gt;先 &lt;a href=&quot;https://github.com/CuteLeaf/Firefly/fork&quot; target=&quot;_blank&quot;&gt;Fork&lt;/a&gt; 到自己仓库在克隆（推荐），记得先点 Star 在 Fork 哦！&lt;/strong&gt;&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;git clone https://github.com/yzg011/astro.git&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;cd astro&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;安装依赖：&lt;/strong&gt;&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 如果没有安装 pnpm，先安装&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npm install -g pnpm&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 安装项目依赖&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;pnpm install&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;配置博客：&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;编辑 &lt;code&gt;src/config/&lt;/code&gt; 目录下的配置文件自定义博客设置&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;启动开发服务器：&lt;/strong&gt;&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;pnpm dev&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;p&gt;博客将在 &lt;code&gt;http://localhost:4321&lt;/code&gt; 可用&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;平台托管部署&lt;a href=&quot;#平台托管部署&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;参考&lt;a href=&quot;https://docs.astro.build/zh-cn/guides/deploy/&quot; target=&quot;_blank&quot;&gt;官方指南&lt;/a&gt;将博客部署至 Vercel, Netlify, Cloudflare Pages, EdgeOne Pages 等。&lt;/strong&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Vercel&lt;/strong&gt;、&lt;strong&gt;Netlify&lt;/strong&gt; 等主流平台自动部署，会根据环境自动选择适配器。&lt;/p&gt;
&lt;p&gt;框架预设： &lt;code&gt;Astro&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;根目录： &lt;code&gt;./&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;输出目录： &lt;code&gt;dist&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;构建命令： &lt;code&gt;pnpm run build&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;安装命令： &lt;code&gt;pnpm install&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href=&quot;https://vercel.com/new/clone?repository-url=https://github.com/CuteLeaf/Firefly&amp;amp;project-name=Firefly&amp;amp;repository-name=Firefly&quot; target=&quot;_blank&quot;&gt;&lt;/a&gt;&lt;/p&gt;&lt;figure&gt;&lt;a href=&quot;https://vercel.com/new/clone?repository-url=https://github.com/CuteLeaf/Firefly&amp;amp;project-name=Firefly&amp;amp;repository-name=Firefly&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;https://camo.githubusercontent.com/7015516519ae874ab75537283bc75f86b3d46386ed994093a3790a1180913164/68747470733a2f2f76657263656c2e636f6d2f627574746f6e&quot; alt=&quot;Deploy with Vercel&quot; /&gt;&lt;figcaption&gt;Deploy with Vercel&lt;/figcaption&gt;&lt;/a&gt;&lt;/figure&gt; &lt;a href=&quot;https://app.netlify.com/start/deploy?repository=https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;&lt;figure&gt;&lt;img src=&quot;https://camo.githubusercontent.com/de47084e2d5a8948486a2238f1517e465560ec293c4a2cba80020472f8d5c80a/68747470733a2f2f7777772e6e65746c6966792e636f6d2f696d672f6465706c6f792f627574746f6e2e737667&quot; alt=&quot;Deploy to Netlify&quot; /&gt;&lt;figcaption&gt;Deploy to Netlify&lt;/figcaption&gt;&lt;/figure&gt;&lt;/a&gt;&lt;p&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;📖 配置说明&lt;a href=&quot;#-配置说明&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;blockquote&gt;&lt;p&gt;📚 &lt;strong&gt;详细配置文档&lt;/strong&gt;: 查看 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/&quot; target=&quot;_blank&quot;&gt;Firefly使用文档&lt;/a&gt; 获取完整的配置指南&lt;/p&gt;&lt;/blockquote&gt;&lt;section&gt;&lt;h3&gt;设置网站语言&lt;a href=&quot;#设置网站语言&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;要设置博客的默认语言，请编辑 &lt;code&gt;src/config/siteConfig.ts&lt;/code&gt; 文件：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 定义站点语言&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;const SITE_LANG = &quot;zh_CN&quot;;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;支持的语言代码：&lt;/strong&gt;&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;zh_CN&lt;/code&gt; - 简体中文&lt;/li&gt;
&lt;li&gt;&lt;code&gt;zh_TW&lt;/code&gt; - 繁体中文&lt;/li&gt;
&lt;li&gt;&lt;code&gt;en&lt;/code&gt; - 英文&lt;/li&gt;
&lt;li&gt;&lt;code&gt;ja&lt;/code&gt; - 日文&lt;/li&gt;
&lt;li&gt;&lt;code&gt;ru&lt;/code&gt; - 俄文&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;配置文件结构&lt;a href=&quot;#配置文件结构&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;src/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;├── config/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── index.ts              # 配置索引文件&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── siteConfig.ts         # 站点基础配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── backgroundWallpaper.ts # 背景壁纸配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── profileConfig.ts      # 用户资料配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── commentConfig.ts      # 评论系统配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── announcementConfig.ts # 公告配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── licenseConfig.ts      # 许可证配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── footerConfig.ts       # 页脚配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── FooterConfig.html     # 页脚HTML内容&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── expressiveCodeConfig.ts # 代码高亮配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── sakuraConfig.ts       # 樱花特效配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── fontConfig.ts         # 字体配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── sidebarConfig.ts      # 侧边栏布局配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── navBarConfig.ts       # 导航栏配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── musicConfig.ts        # 音乐播放器配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── pioConfig.ts          # 看板娘配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── adConfig.ts           # 广告配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── friendsConfig.ts      # 友链配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── galleryConfig.ts      # 相册配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   ├── sponsorConfig.ts      # 赞助配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;│   └── coverImageConfig.ts  # 文章封面图配置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;⚙️ 文章 Frontmatter&lt;a href=&quot;#️-文章-frontmatter&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;title: My First Blog Post&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;published: 2023-09-09&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;description: This is the first post of my new Astro blog.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;image: ./cover.jpg  # 或使用 &quot;api&quot; 来启用随机封面图&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;tags: [Foo, Bar]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;category: Front-end&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;draft: false&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;lang: zh-CN      # 仅当文章语言与 `siteConfig.ts` 中的网站语言不同时需要设置&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;pinned: false    # 置顶&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;comment: true    # 是否允许评论&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🧩 Markdown 扩展语法&lt;a href=&quot;#-markdown-扩展语法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;除了 Astro 默认支持的 &lt;a href=&quot;https://github.github.com/gfm/&quot; target=&quot;_blank&quot;&gt;GitHub Flavored Markdown&lt;/a&gt; 之外，还包含了一些额外的 Markdown 功能：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;提醒块（Admonitions） - 支持 GitHub, Obsidian, VitePress 三种风格主题配置 (&lt;a href=&quot;https://firefly.cuteleaf.cn/posts/markdown-extended/&quot;&gt;预览和用法&lt;/a&gt;)&lt;/li&gt;
&lt;li&gt;GitHub 仓库卡片 (&lt;a href=&quot;https://firefly.cuteleaf.cn/posts/markdown-extended/&quot;&gt;预览和用法&lt;/a&gt;)&lt;/li&gt;
&lt;li&gt;基于 Expressive Code 的增强代码块 (&lt;a href=&quot;http://firefly.cuteleaf.cn/posts/code-examples/&quot;&gt;预览&lt;/a&gt; / &lt;a href=&quot;https://expressive-code.com/&quot; target=&quot;_blank&quot;&gt;文档&lt;/a&gt;)&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🧞 指令&lt;a href=&quot;#-指令&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;下列指令均需要在项目根目录执行：&lt;/p&gt;












































&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;Command&lt;/th&gt;&lt;th&gt;Action&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm install&lt;/code&gt;&lt;/td&gt;&lt;td&gt;安装依赖&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm dev&lt;/code&gt;&lt;/td&gt;&lt;td&gt;在 &lt;code&gt;localhost:4321&lt;/code&gt; 启动本地开发服务器&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm build&lt;/code&gt;&lt;/td&gt;&lt;td&gt;构建网站至 &lt;code&gt;./dist/&lt;/code&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm preview&lt;/code&gt;&lt;/td&gt;&lt;td&gt;本地预览已构建的网站&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm check&lt;/code&gt;&lt;/td&gt;&lt;td&gt;检查代码中的错误&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm format&lt;/code&gt;&lt;/td&gt;&lt;td&gt;使用Biome格式化您的代码&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm new-post &amp;lt;filename&amp;gt;&lt;/code&gt;&lt;/td&gt;&lt;td&gt;创建新文章&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm astro ...&lt;/code&gt;&lt;/td&gt;&lt;td&gt;执行 &lt;code&gt;astro add&lt;/code&gt;, &lt;code&gt;astro check&lt;/code&gt; 等指令&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;code&gt;pnpm astro --help&lt;/code&gt;&lt;/td&gt;&lt;td&gt;显示 Astro CLI 帮助&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;/section&gt;</content:encoded></item><item><title>64岁抬棺西征，保全166万国土——晚清对外唯一胜仗</title><link>https://firefly.cuteleaf.cn/posts/%E5%B7%A6%E5%AE%97%E6%A3%A0/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E5%B7%A6%E5%AE%97%E6%A3%A0/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;#64岁抬棺西征，保全166万国土——晚清对外唯一胜仗&lt;/p&gt;
&lt;p&gt;◆ ◇ ◆&lt;/p&gt;
&lt;section&gt;&lt;h1&gt;&lt;/h1&gt;&lt;p&gt;64岁抬棺西征&lt;/p&gt;&lt;section&gt;&lt;h2&gt;&lt;a href=&quot;#-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;保全166万国土，晚清对外唯一胜仗&lt;/p&gt;&lt;p&gt;左宗棠 · 新疆收复战 · 1876—1881&lt;/p&gt;&lt;p&gt;“中国的土地，一点都不能少。”&lt;/p&gt;&lt;p&gt;—— 左宗棠&lt;/p&gt;&lt;p&gt;壹&lt;/p&gt;&lt;p&gt;朝堂之争：弃与守的抉择&lt;/p&gt;&lt;p&gt;1875年，大清王朝风雨飘摇，列强环伺，割地赔款已成家常便饭。就在这内忧外患之际，朝堂之上爆发了一场关乎国家命运的大辩论。&lt;/p&gt;&lt;p&gt;李鸿章&lt;/p&gt;&lt;p&gt;新疆乃不毛之地&lt;br /&gt;
不要就不要了&lt;br /&gt;
当务之急是东南沿海&lt;/p&gt;&lt;p&gt;左宗棠&lt;/p&gt;&lt;p&gt;166万平方公里&lt;br /&gt;
一点都不能少！&lt;br /&gt;
再不收复将彻底失去&lt;/p&gt;&lt;p&gt;新疆的地域位置极其特殊——它不仅是丝绸之路的重要通道，更与八个国家接壤。新疆一丢，中国的门户大开，列强便可俯冲而下，不但西北无险可守，东南沿海也将被趁机瓜分。&lt;/p&gt;&lt;p&gt;⚠️ 新疆一丢 → 门户大开 → 列强俯冲而下 → 西北无险可守 → 东南被瓜分&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;贰&lt;/p&gt;&lt;p&gt;群狼环伺：新疆的危局&lt;/p&gt;&lt;p&gt;当时的清王朝，哪一个列强都想上来踩一脚、分一杯羹。日本入侵台湾，各地动荡不安。新疆更是乱成了一锅粥——五人自立为王，其中喀什引狼入室，从中亚请来了外援&lt;strong&gt;阿古柏&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;阿古柏逐步吞并各方势力，眼看整个新疆都将落入其囊中。就在此时，有人急眼了——但急眼的不是清政府，而是俄国和英国。&lt;/p&gt;&lt;p&gt;🇷🇺 英俄博弈 🇬🇧&lt;/p&gt;&lt;p&gt;&lt;strong&gt;🇷🇺 沙俄&lt;/strong&gt; — 趁乱侵占了伊犁20多万平方公里，稳坐钓鱼台&lt;/p&gt;&lt;p&gt;⇅&lt;/p&gt;&lt;p&gt;&lt;strong&gt;🇬🇧 英国&lt;/strong&gt; — 担心沙俄威胁英属印度，主动联络阿古柏，签订英阿条约，给予军事支援&lt;/p&gt;&lt;p&gt;⇅&lt;/p&gt;&lt;p&gt;&lt;strong&gt;🇬🇧 暗中搞鬼&lt;/strong&gt; — 英国使者偷偷找到李鸿章，推动”放弃新疆”的主张&lt;/p&gt;&lt;p&gt;英国的算盘打得很精——阿古柏比清政府更好掌控。与其让中国收复新疆，不如扶植一个听话的傀儡。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;叁&lt;/p&gt;&lt;p&gt;力挽狂澜：万言书与朝堂辩论&lt;/p&gt;&lt;p&gt;左宗棠急了。他做了两件事：&lt;/p&gt;&lt;p&gt;1&lt;/p&gt;&lt;p&gt;&lt;strong&gt;写万言书&lt;/strong&gt;，详细论述新疆对朝廷的战略重要性&lt;/p&gt;&lt;p&gt;2&lt;/p&gt;&lt;p&gt;&lt;strong&gt;朝堂辩论&lt;/strong&gt;，当塞防与海防吵成一锅粥时，他力主二者同等重要、可以兼顾&lt;/p&gt;&lt;p&gt;“塞防与海防二者同等重要，可以两头兼顾。这并非难事。”&lt;/p&gt;&lt;p&gt;——左宗棠朝堂发言&lt;/p&gt;&lt;p&gt;在他有理有据的论证下，清政府最终投票给左宗棠，任命他为&lt;strong&gt;钦差大臣&lt;/strong&gt;，收复新疆。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;肆&lt;/p&gt;&lt;p&gt;三大难题与绝妙破局&lt;/p&gt;&lt;p&gt;收复新疆不是过过嘴瘾，三大难题横亘眼前：钱少、兵器少、地方远。左宗棠仔细分析局势，定下八字方针——&lt;/p&gt;&lt;p&gt;先北后南&lt;/p&gt;&lt;p&gt;缓进急攻&lt;/p&gt;&lt;p&gt;&lt;strong&gt;先北后南&lt;/strong&gt;：阿古柏主要势力在南疆，先取北疆，以攻为守，稳中求胜。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;缓进急攻&lt;/strong&gt;：军费有限，准备必须充分，一旦开战则速战速决。&lt;/p&gt;&lt;p&gt;三大难题 · 三大破解&lt;/p&gt;&lt;p&gt;💰 钱少 → 胡雪岩担保，贷款2000万两&lt;/p&gt;&lt;p&gt;慈禧只给了一点路费都不够的钱，左宗棠通过红顶商人胡雪岩向国外银行贷款，凑齐军费&lt;/p&gt;&lt;p&gt;🔫 兵器少 → 自建兵工厂&lt;/p&gt;&lt;p&gt;设立西安机器局和兰州制造局，专门制造洋枪洋炮&lt;/p&gt;&lt;p&gt;🌾 粮草远 → 利用英俄矛盾&lt;/p&gt;&lt;p&gt;最绝的一招——向俄国人买粮食！沙俄巴不得左宗棠和阿古柏打得越激烈越好，好坐收渔利&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;伍&lt;/p&gt;&lt;p&gt;抬棺西征：64岁的铁血壮歌&lt;/p&gt;&lt;p&gt;1876年&lt;/p&gt;&lt;p&gt;西征军六七万人向西而去&lt;/p&gt;&lt;p&gt;64岁的左宗棠，抬着棺材，披挂上阵&lt;/p&gt;&lt;p&gt;他年纪大了，背是佝偻着的，&lt;/p&gt;&lt;p&gt;但那一刻——&lt;/p&gt;&lt;p&gt;军队的脊梁却是挺着的。&lt;/p&gt;&lt;p&gt;这是何等的悲壮。&lt;/p&gt;&lt;p&gt;⏱ 西征战绩&lt;/p&gt;&lt;p&gt;不到三个月&lt;/p&gt;&lt;p&gt;收复除伊犁以外的北疆&lt;/p&gt;&lt;p&gt;冬天来临&lt;/p&gt;&lt;p&gt;果断停兵，养精蓄锐，不为战而战&lt;/p&gt;&lt;p&gt;来年春天&lt;/p&gt;&lt;p&gt;南疆之战，对方溃不成军&lt;/p&gt;&lt;p&gt;仅一年半&lt;/p&gt;&lt;p&gt;收复除伊犁以外全部新疆 ✅&lt;/p&gt;&lt;p&gt;去过新疆的人就知道，从北疆到南疆，开着越野车都需要花费大量时间，更何况是那个年代？这就是一个奇迹。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;陆&lt;/p&gt;&lt;p&gt;铁骨铮铮：怒怼英国，再战伊犁&lt;/p&gt;&lt;p&gt;冬季休战期间，英国不断向清政府试探，企图让阿古柏作为属国而存在。清廷内部妥协之声渐起。&lt;/p&gt;&lt;p&gt;“英国人为什么不在印度或者你们自己的国家割让一块领土给阿古柏建国？怎么非得让中国割让领土？”&lt;/p&gt;&lt;p&gt;“再遇到英国人来交涉，直接让他来找我。”&lt;/p&gt;&lt;p&gt;左宗棠对英国战略图谋的精准分析，铿锵有力的言辞表达，就像风雨飘摇中的&lt;strong&gt;定海神针&lt;/strong&gt;——多么有安全感的存在。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;柒&lt;/p&gt;&lt;p&gt;再抬棺：68岁血战伊犁&lt;/p&gt;&lt;p&gt;收复新疆后，伊犁仍在俄国人手中。清政府派人去谈判，竟签下屈辱条约——不但没收回伊犁，反而赔偿俄国280万两白银！&lt;/p&gt;&lt;p&gt;伊犁本属大清 → 条约竟赔280万两 → 左宗棠怒不可遏！&lt;/p&gt;&lt;p&gt;他迅速从愤怒中冷静下来，准备武力收复伊犁。&lt;strong&gt;1880年，68岁的左宗棠再次抬棺&lt;/strong&gt;，摆出血战到底的架势，一路北上。&lt;/p&gt;&lt;p&gt;沙俄急了，派军舰恐吓清政府。左宗棠却看得透彻：“他们就是虚张声势，不敢怎样的。“谈判中果然如此——连年战争让沙俄内伤严重，而西征军展现出的现代化武器实力更让俄人胆寒。&lt;/p&gt;&lt;p&gt;1881年&lt;/p&gt;&lt;p&gt;中俄伊犁条约&lt;/p&gt;&lt;p&gt;伊犁主权正式归还中国 🇨🇳&lt;/p&gt;&lt;p&gt;这是俄国立国以来不曾有过的事情——破天荒的第一次&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;捌&lt;/p&gt;&lt;p&gt;故土新归：新疆建省&lt;/p&gt;&lt;p&gt;1882年，左宗棠提出在新疆建省。清政府于&lt;strong&gt;1884年11月17日&lt;/strong&gt;正式批准。&lt;/p&gt;&lt;p&gt;旧称&lt;/p&gt;&lt;p&gt;西 域&lt;/p&gt;&lt;p&gt;⬇&lt;/p&gt;&lt;p&gt;新名 · 因”故土新归”而得名&lt;/p&gt;&lt;p&gt;新 疆&lt;/p&gt;&lt;p&gt;1/6&lt;/p&gt;&lt;p&gt;占中国领土&lt;/p&gt;&lt;p&gt;4个&lt;/p&gt;&lt;p&gt;面积堪比法国&lt;/p&gt;&lt;p&gt;8国&lt;/p&gt;&lt;p&gt;接壤邻国&lt;/p&gt;&lt;p&gt;新疆并非什么贫瘠之地。这里物产丰富，土地宽阔，对国家的经济发展和战略布局有着举足轻重的地位。&lt;/p&gt;&lt;p&gt;◆ ◇ ◆&lt;/p&gt;&lt;p&gt;左宗棠&lt;/p&gt;&lt;p&gt;自李世民以来对中国领土贡献最大的人物&lt;/p&gt;&lt;p&gt;晚清最后一块硬骨头 · 纯爷们儿&lt;/p&gt;&lt;p&gt;💭 设想一下&lt;/p&gt;&lt;p&gt;如果当年听了李鸿章的话——我们现在去新疆，都得办护照才行。&lt;/p&gt;&lt;p&gt;完&lt;/p&gt;&lt;p&gt;铭记历史 · 致敬先贤&lt;/p&gt;&lt;p&gt;本文内容整理自历史资料&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>张居正：一根燃烧自己的脊梁</title><link>https://firefly.cuteleaf.cn/posts/%E5%BC%A0%E5%B1%85%E6%AD%A3/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E5%BC%A0%E5%B1%85%E6%AD%A3/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;张居正&lt;a href=&quot;#张居正&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;一根燃烧自己的脊梁&lt;a href=&quot;#一根燃烧自己的脊梁&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;他改造了一个腐朽的帝国，却被那个帝国彻底清算。&lt;br /&gt;
他是中国历史上最孤独的改革者。&lt;/p&gt;&lt;p&gt;张居正被称为「明朝第一政治家」。论给王朝续命，郭子仪续了唐朝150年，于谦续了大明110年，他的60年并不是最多的。那他究竟凭什么封神？&lt;/p&gt;&lt;p&gt;一&lt;/p&gt;&lt;section&gt;&lt;h3&gt;他挑战的，是千年的摸鱼文化&lt;a href=&quot;#他挑战的是千年的摸鱼文化&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;张居正之所以成为历代改革者的图腾，核心在于他做了一件&lt;strong&gt;极度反人性、甚至反体制&lt;/strong&gt;的事：&lt;/p&gt;&lt;p&gt;他在一个以道德为核心驱动的文官系统里，强行植入了一套&lt;strong&gt;以数据和效率为核心的 KPI 考核系统&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;他挑战的不仅仅是贪官污吏，他挑战的是中国古代儒家官场上千年来的&lt;strong&gt;摸鱼文化和伪君子生态&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;咱们今天要聊的，就是这场被称作「万历中兴」背后的&lt;br /&gt;
系统重构与人性陷阱。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;二&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;隆庆留下的，是一个瘫痪的帝国&lt;a href=&quot;#隆庆留下的是一个瘫痪的帝国&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;隆庆皇帝驾崩，留给张居正的并不是烽火连天，而是一种更可怕的状态——&lt;/p&gt;&lt;p&gt;瘫　痪&lt;/p&gt;&lt;p&gt;朝廷发出的命令，出了皇宫就是一张废纸。&lt;br /&gt;
地方收上来的税银进了国库全是赤字。&lt;br /&gt;
满朝文武最擅长的只有两件事：踢皮球和打嘴炮。&lt;/p&gt;&lt;p&gt;这种政令不通、上下脱节的死寂，比真正的战争更难对付，因为看不见敌人，却能让帝国窒息而死。&lt;/p&gt;&lt;p&gt;按照官场的生存算法，摆在张居正面前有一条&lt;strong&gt;最优解&lt;/strong&gt;：像老师徐阶那样做一个太极宗师——多磕头少说话，谁都不得罪，把皇帝哄开心，把同僚哄舒服，哪怕大明再烂，混个几十年不成问题，还能博得生前身后名。&lt;/p&gt;&lt;p&gt;但身处最高处的责任感，让他根本无法装睡。财政赤字就像一个巨大的黑洞，一旦农民起义的临界点被突破，大明就会像积木一样垮塌。于是他决定：&lt;strong&gt;不做受人爱戴的形象，要做令人畏惧的独裁者。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;三&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;考成法：给大明安装企业级 KPI&lt;a href=&quot;#考成法给大明安装企业级-kpi&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;在张居正之前，官员的好坏怎么评定？靠口碑，靠道德，靠文章写得漂不漂亮——这玩意太虚了，全是主观操作空间。&lt;/p&gt;&lt;p&gt;张居正不管这一套。他发明了**「三本账」**：&lt;/p&gt;&lt;p&gt;📋&lt;/p&gt;&lt;p&gt;政令立项时&lt;/p&gt;&lt;p&gt;登记一本&lt;br /&gt;
明确事项与期限&lt;/p&gt;&lt;p&gt;🏛️&lt;/p&gt;&lt;p&gt;执行衙门&lt;/p&gt;&lt;p&gt;留一本&lt;br /&gt;
随时核查进度&lt;/p&gt;&lt;p&gt;⚖️&lt;/p&gt;&lt;p&gt;监察机构&lt;/p&gt;&lt;p&gt;留一本&lt;br /&gt;
专司考核问责&lt;/p&gt;&lt;p&gt;规则只有一条：到了日子，事儿没办成——不管你道德多高尚，不管你文章多锦绣，&lt;strong&gt;直接降级、撤职。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;一夜之间，大明官场画风突变。那些习惯了喝茶、看报、高谈阔论的士大夫们，突然发现自己变成了大厂里的螺丝钉，每天一睁眼就是数据进度条，结案率变成了流水线，首辅变成了监工。&lt;/p&gt;&lt;p&gt;📜 史料记载&lt;/p&gt;&lt;p&gt;「考成法实行没多久，但是朝令夕行，以前几年办不成的事，现在几天就办完了。」&lt;/p&gt;&lt;p&gt;为什么？因为&lt;strong&gt;恐惧&lt;/strong&gt;。张居正剥离了官员身上那层道德光环，直接把他们还原成了行政工具。他要告诉所有人：&lt;em&gt;别跟我谈情怀，我只要结果。&lt;/em&gt;&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;四&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;一条鞭法：打通帝国的金融接口&lt;a href=&quot;#一条鞭法打通帝国的金融接口&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;一条鞭法实施之前，老百姓交税简直是噩梦：交粮、交布、还要去给官府当免费劳动力。汇率换算、中间商盘剥，能把一个中产之家直接搞破产，而且数据极其混乱，国家根本不知道自己有多少家底。&lt;/p&gt;&lt;p&gt;张居正下令：&lt;strong&gt;把所有的田赋、徭役、杂税全部折算成银两。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;改革前&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;实物征税，种类繁杂&lt;/li&gt;
&lt;li&gt;中间商层层盘剥&lt;/li&gt;
&lt;li&gt;农民被随意拉去当苦力&lt;/li&gt;
&lt;li&gt;国家账目一塌糊涂&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;改革后&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;全部折银，清晰透明&lt;/li&gt;
&lt;li&gt;贪官上下其手空间压缩&lt;/li&gt;
&lt;li&gt;农民只需种地卖钱交银&lt;/li&gt;
&lt;li&gt;帝国完成赋税货币化&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;为推行一条鞭法，张居正还搞了&lt;strong&gt;清丈田亩&lt;/strong&gt;——大明朝的人口普查加资产审计。这一查，查出了整整 &lt;strong&gt;3亿亩&lt;/strong&gt; 的隐形土地。这些地都是皇亲国戚、豪门大户偷偷藏起来不交税的。&lt;/p&gt;&lt;p&gt;张居正是从既得利益集团的嘴里&lt;br /&gt;
硬生生把肉抠出来喂给了国库。&lt;/p&gt;&lt;p&gt;太仓的粮食，哪怕吃到腐烂都吃不完。但他也因此彻底得罪了全天下的读书人和权贵——从此以后，张居正不再是他们的宰相，而是夺人钱财的**「独夫民贼」**。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;五&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;夺情风波：在名节与国运之间选择&lt;a href=&quot;#夺情风波在名节与国运之间选择&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;万历五年，张居正的父亲去世。按照封建礼教，官员必须辞职回家守孝三年，这叫「丁忧」，是天大的规矩，是孝道的底线。&lt;/p&gt;&lt;p&gt;保守派们兴奋了。他们像闻到血腥味的鲨鱼一样围了上来——并不是真的在乎孝道，他们在乎的是：&lt;strong&gt;只要把张居正赶回家三年，所有改革就能立马废除，大家又能回到那个舒服的日子。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;地狱级抉择&lt;/p&gt;&lt;p&gt;回家守孝&lt;/p&gt;&lt;p&gt;保全名节&lt;br /&gt;
改革前功尽弃&lt;/p&gt;&lt;p&gt;留任夺情&lt;/p&gt;&lt;p&gt;保住改革&lt;br /&gt;
被全天下骂作衣冠禽兽&lt;/p&gt;&lt;p&gt;最终，在个人名节与帝国国运之间，张居正选择了后者。他穿着黑色的孝服走进了内阁，继续高压批阅奏章。面对满朝文武的唾沫星子，面对学生们的倒戈，他仍不为所动，直接祭出雷霆万钧的镇压手段——停谏言、流放反对派，用铁腕意志压制了一切杂音。&lt;/p&gt;&lt;p&gt;「无非相乃摄也」&lt;/p&gt;&lt;p&gt;如果你叫我当这个家，我就要负责到底，&lt;br /&gt;
哪怕粉身碎骨，在所不惜。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;六&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;他知道自己是在为帝国燃烧&lt;a href=&quot;#他知道自己是在为帝国燃烧&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;张居正就像一个疯狂的火车司机，把刹车焊死，还要往炉子里疯狂铲煤——只为了让这列破火车冲过即将到来的悬崖。他把所有的权力、威望，甚至自己的道德评价，都当成了改革的燃料。&lt;/p&gt;&lt;p&gt;万历十年，张居正积劳成疾，死在岗位上，享年 &lt;strong&gt;58岁&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;他以为自己为大明留下了万世基业。结果他前脚刚死，那个被他从小教育长大的万历皇帝就露出了獠牙。&lt;/p&gt;&lt;p&gt;万历皇帝的清算清单&lt;/p&gt;&lt;p&gt;抄家夺爵&lt;/p&gt;&lt;p&gt;长子自杀，家属饿死&lt;/p&gt;&lt;p&gt;差点开棺鞭尸&lt;/p&gt;&lt;p&gt;考成法被废除，官员欢呼雀跃，终于又可以摸鱼了&lt;/p&gt;&lt;p&gt;这不只是万历的报复，更是整个官僚系统的反扑。**张居正想用法家的手段去改造一个儒家的底盘，这本身就是一场注定失败的基因工程。**他活着，靠的是皇权特许的威慑力；他死了，这种威慑力瞬间反噬。&lt;/p&gt;&lt;p&gt;讽刺的是，万历皇帝把张居正斗倒斗臭，却始终舍不得废除一条鞭法。因为真香——国库里的银子是实打实的。万历 48 年不上朝，大明没垮，靠的就是张居正留下的这点老本。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;尾&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;孤独的守夜人&lt;a href=&quot;#孤独的守夜人&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;回望四百多年前那个背影，他是一个彻头彻尾的悲剧英雄——像一个孤独的守夜人，在漫长的黑夜里点燃了自己的骨头，试图照亮这个庞大而陈旧的帝国。&lt;/p&gt;&lt;p&gt;一个没有制度保障、纯粹依赖强人意志的改革，注定只是一道短暂的光。&lt;/p&gt;&lt;p&gt;但即便如此，只要那个代表着家国担当的图腾还在&lt;/p&gt;&lt;p&gt;「虽千万人，吾往矣」&lt;/p&gt;&lt;p&gt;张居正这个名字，就永远是中国历史上&lt;br /&gt;
最硬的一根脊梁。&lt;/p&gt;&lt;p&gt;敢于在腐朽的惯性中逆流而上，敢于在必死的绝境里力挽狂澜，&lt;br /&gt;
这才是张居正被称为**「宰相之杰」**的真正原因。&lt;/p&gt;&lt;p&gt;喜欢这篇文章？欢迎在抖音APP点击右下角的**「推荐」大拇指按钮**&lt;/p&gt;&lt;p&gt;让更多人看见这段历史 ↑&lt;/p&gt;&lt;p&gt;历史解读系列&lt;/p&gt;&lt;p&gt;开窍的最快方式，就是多看历史&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>千古第一才女李清照</title><link>https://firefly.cuteleaf.cn/posts/%E6%9D%8E%E6%B8%85%E7%85%A7/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E6%9D%8E%E6%B8%85%E7%85%A7/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;李清照&lt;a href=&quot;#李清照&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;千古第一才女 · 婉约词宗&lt;/p&gt;&lt;p&gt;“生当作人杰，死亦为鬼雄”&lt;br /&gt;
——一个灵魂比时代更强大的女子&lt;/p&gt;&lt;p&gt;在中国漫长的文学史上，有一位女子，她的名字穿越近千年时光，依然熠熠生辉。她出身名门，才华绝代；她敢爱敢恨，活得热烈而真实。她就是&lt;strong&gt;李清照&lt;/strong&gt;——中国历史上最伟大的女词人，被誉为”千古第一才女&quot;&quot;婉约词宗”。&lt;/p&gt;&lt;p&gt;然而，她的人生远非”婉约”二字可以概括。她打牌喝酒、逢赌必赢，她写词怼遍文坛、狂傲不羁，她在国破家亡之际写下豪气干云的诗篇，在遭遇家暴时毅然状告丈夫离婚。她是一个活生生的人，有血有肉、敢怒敢言。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;壹&lt;/p&gt;&lt;section&gt;&lt;h2&gt;名门闺秀 · 天赋异禀&lt;a href=&quot;#名门闺秀--天赋异禀&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元1084年 — 少年时期（汴京）&lt;/p&gt;&lt;p&gt;🌸&lt;/p&gt;&lt;p&gt;少女李清照：藕花深处的灵秀少女&lt;/p&gt;&lt;p&gt;投胎是个技术活，而李清照在这方面多少是有些天赋在身上的。&lt;/p&gt;&lt;p&gt;她的父亲李格非，是苏轼的学生，官至礼部郎中，学识渊博；生母是宰相王珪的女儿，系出名门；继母更是状元拱辰的孙女。这样的家庭背景意味着什么？意味着家里来往的叔叔大爷们，不是苏轼就是黄庭坚这样的人物。&lt;strong&gt;可以说，半个北宋文坛都是她的启蒙老师。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;更重要的是，父亲的家教非常开明。在那个”女子无才便是德”的年代，李格非从不拿三从四德这些条条框框约束女儿。他给女儿取名”清照”，取自王维的诗句”明月松间照，清泉石上流”，寓意女儿一生如月光般明亮清澈、如泉水般自由流淌。他希望女儿快乐、无拘无束地活着。&lt;/p&gt;&lt;p&gt;而李清照，也完全没有辜负父亲的期望。&lt;/p&gt;&lt;p&gt;🍶&lt;/p&gt;&lt;p&gt;爱喝酒&lt;/p&gt;&lt;p&gt;别的小姑娘品茶，她咕咚咕咚灌酒&lt;/p&gt;&lt;p&gt;🎲&lt;/p&gt;&lt;p&gt;爱赌博&lt;/p&gt;&lt;p&gt;别人绣花她摇色子，还写《打马图经》&lt;/p&gt;&lt;p&gt;⛵&lt;/p&gt;&lt;p&gt;爱划船&lt;/p&gt;&lt;p&gt;出门不带扇子遮面，挽起袖子就划船&lt;/p&gt;&lt;p&gt;那是一个寻常的日子，十五六岁的李清照和朋友们出去游玩，喝得兴高采烈，划着船晃晃悠悠就滑到了藕花深处。一抬头——**这是哪儿啊？**只见天空中被惊飞的鸥鹭扑棱棱四散而去，少女迷迷瞪瞪又带着几分醉意，随口吟出：&lt;/p&gt;&lt;p&gt;《如梦令》&lt;/p&gt;&lt;p&gt;常记溪亭日暮，沉醉不知归路。&lt;/p&gt;&lt;p&gt;兴尽晚回舟，误入藕花深处。&lt;/p&gt;&lt;p&gt;争渡，争渡，&lt;/p&gt;&lt;p&gt;惊起一滩鸥鹭。&lt;/p&gt;&lt;p&gt;这首小词一出，整个北宋文坛都被惊到了&lt;/p&gt;&lt;p&gt;大伙儿纷纷打听：这写得如此灵动的小词，是谁家的姑娘？可这才哪到哪儿啊，&lt;strong&gt;小娘子还没发力呢。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;又一个清晨，李清照顶着宿醉的迷糊劲儿，趴在床边扶着太阳穴。依稀记得昨晚又是风雨交加，便担心地问丫鬟：“院子里的海棠花怎么样了？“丫鬟正忙着干活，哪有闲心赏花，随口回了一句：“还跟昨天一样呗。”&lt;/p&gt;&lt;p&gt;李清照撇了撇嘴：&lt;strong&gt;怎么可能一样呢？你知不知道——&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;《如梦令·昨夜雨疏风骤》&lt;/p&gt;&lt;p&gt;昨夜雨疏风骤，浓睡不消残酒。&lt;/p&gt;&lt;p&gt;试问卷帘人，却道海棠依旧。&lt;/p&gt;&lt;p&gt;知否，知否？&lt;/p&gt;&lt;p&gt;应是绿肥红瘦。&lt;/p&gt;&lt;p&gt;“肥”与”瘦”形容花朵——此前从未有人这样写过！&lt;/p&gt;&lt;p&gt;这一次，李清照的名字瞬间冲上了汴京城的热搜榜。人人都知道老李家有个才华横溢、待字闺中的天才少女。说媒的、提亲的乌泱乌泱往李家跑，门槛都快被踏平了。&lt;/p&gt;&lt;p&gt;❀ ❀ ❀&lt;/p&gt;&lt;p&gt;贰&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;琴瑟和鸣 · 灵魂伴侣&lt;a href=&quot;#琴瑟和鸣--灵魂伴侣&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元1101年 — 青州隐居十四年&lt;/p&gt;&lt;p&gt;💕&lt;/p&gt;&lt;p&gt;秋千初遇：一眼万年的怦然心动&lt;/p&gt;&lt;p&gt;那些蜂拥而至的追求者中，有一个年轻人名叫&lt;strong&gt;赵明诚&lt;/strong&gt;。他的父亲赵挺之曾做过李格非的上司，而赵明诚虽说是标准的官二代，却丝毫没有纨绔子弟的臭毛病。年纪轻轻就在收藏界小有名号，被称为”金石才子”，彼时还在太学读书，毕业后就是妥妥的公务员。&lt;/p&gt;&lt;p&gt;一次偶然的机会，赵明诚读到了李清照的词。**从此一发不可收拾——这世上怎么会有如此惊才绝艳的女子？**虽然还没见过面，不知道她是高是矮、是美是丑，但在他的心里，李清照已经是偶像女神级别的人物了。&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;蹴罢秋千，起来慵整纤纤手。露浓花瘦，薄汗轻衣透。&lt;br /&gt;
见客入来，袜刬金钗溜。和羞走，倚门回首，却把青梅嗅。&lt;/p&gt;&lt;p&gt;——《点绛唇》| 秋千架旁，假装嗅梅的偷望&lt;/p&gt;&lt;p&gt;偶遇是谈恋爱最经典的套路。一天，李清照正在院子里荡秋千，微风吹动着少女飘逸的纱衣，正玩得开心呢，瞥见父亲和一位风度翩翩的年轻公子走过来。**不好，有帅哥！今天没化妆！**于是匆忙躲避，却又忍不住想多看两眼，便假装嗅着青梅，来了一次饱含深情的偷望。&lt;/p&gt;&lt;p&gt;赵明成心里也滋啦滋啦通上了电——**糟了，是心动的感觉。**下定决心：非她不娶！&lt;/p&gt;&lt;p&gt;可赵父听了却犯了难。两家虽说门当户对，但政治立场不同——赵家支持王安石的&lt;strong&gt;新党&lt;/strong&gt;，李家支持苏轼的&lt;strong&gt;旧党&lt;/strong&gt;。不过架不住儿子软磨硬泡，两家又是山东老乡，也都不是什么大人物。算了，成全孩子吧。&lt;/p&gt;&lt;p&gt;公元1101年&lt;/p&gt;&lt;p&gt;21岁的赵明诚迎娶心目中的女神，两人喜结连理&lt;/p&gt;&lt;p&gt;婚后日常&lt;/p&gt;&lt;p&gt;赵明诚挑最美的花送给妻子，问她：“是我好看还是花好看？”&lt;/p&gt;&lt;p&gt;每月初一十五&lt;/p&gt;&lt;p&gt;太学生赵明诚放假回家，先去当铺当衣服换钱买文物古籍&lt;/p&gt;&lt;p&gt;🍵&lt;/p&gt;&lt;p&gt;赌书泼茶：人间最浪漫的夫妻游戏&lt;/p&gt;&lt;p&gt;结婚后，小两口撒起了狗粮。白天赵明诚送花，李清照戴在头上撒娇问：“是我好看还是花好看？“热恋期的赵明诚哪还看得见光瞅着媳妇傻乐——当然是你最好看。&lt;/p&gt;&lt;p&gt;到了晚上，李清照洗了澡，穿一身薄纱画个淡妆，趴在凉席上冲丈夫抛媚眼：“今晚这凉席真舒服，你要不要来试一试呀？“&lt;strong&gt;这样直白露骨的表达，在当时实在太大胆放肆了，没少招人说闲话。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;好在赵明诚不仅尊重妻子，还是个暖男。李清照写词，他不但不拦着，反而欣赏她、支持她，让她痛痛快快做自己。&lt;/p&gt;&lt;p&gt;赵明诚喜欢文物收藏，研究金石学——从古至今都是个烧钱的爱好。李清照不但没埋怨，反而把漂亮衣服、值钱首饰当了换钱来支持丈夫：**老公，没事儿，赶紧买吧！有钱难买心头好。**娶个明事理的媳妇不难，但要娶一个既懂生活情趣又能一起搞事业的伴侣，打着灯笼都难找。&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;人生难得一知己，更何况这知己还是心上人、眼前人、枕边人。她爱你所爱，陪你哭，陪你笑。即使没有豪宅，即使生活清贫，在他们眼里，这就是天底下最好的爱情。&lt;/p&gt;&lt;p&gt;有一次，他们相中了一幅南唐名画《牡丹图》，卖家张口就要二十万钱。小两口砸锅卖铁也凑不出来，只好借回家点上蜡烛欣赏了三天三夜，然后依依不舍地还回去。回家的路上，两人抱头痛哭，一抬头看见对方哭红的眼眶，又破涕为笑。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;公元1107年&lt;/strong&gt;，因朝廷党争牵连，赵家被贬，两人迁居山东青州，开始了长达14年的隐居生活。&lt;/p&gt;&lt;p&gt;不用上班的日子里，这对文艺小青年一个写词作画，一个研究金石收藏——身边是深爱的人，手里是热爱的事，彼此自由自在。&lt;strong&gt;再也没有比这更好的日子了。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;《减字木兰花》&lt;/p&gt;&lt;p&gt;卖花担上，买得一枝春欲放。&lt;/p&gt;&lt;p&gt;泪染轻匀，犹带彤霞晓露痕。&lt;/p&gt;&lt;p&gt;怕郎猜道，奴面不如花面好。&lt;/p&gt;&lt;p&gt;云鬓斜簪，徒要教郎比并看。&lt;/p&gt;&lt;p&gt;“是我好看还是花好看？“——每个恋爱中的女孩都问过的问题&lt;/p&gt;&lt;p&gt;也是在这段时间，25岁的李清照创作了著名的《词论》，大胆点评欧阳修、苏轼、秦观、黄庭坚等文坛泰斗，第一次将诗与词彻底区分开来。丈夫问她谁的词最好，她随手捻起一支桂花：&lt;/p&gt;&lt;p&gt;《鹧鸪天·桂花》&lt;/p&gt;&lt;p&gt;暗淡轻黄体性柔，情疏迹远只香留。&lt;/p&gt;&lt;p&gt;何须浅碧深红色，自是花中第一流。&lt;/p&gt;&lt;p&gt;“何须浅碧深红色，自是花中第一流。” ——就是我呀！&lt;/p&gt;&lt;p&gt;闲暇时，夫妻俩发明了一种有趣的游戏——&lt;strong&gt;“赌书泼茶”&lt;/strong&gt;：在书房里煮一壶新茶，翻一本旧书，说一个典故让对方猜在第几页。猜对了可以喝茶，猜错了——对不起，不但没茶喝，还得负责洗碗做饭！&lt;/p&gt;&lt;p&gt;太学高材生赵明诚自认为读书很有一套，结果每次都输给李清照，一晚上连一口茶都没喝到。李清照举杯大笑，茶水不小心被打翻洒了一身……夫妻俩打打闹闹，反而觉得更有意思。&lt;/p&gt;&lt;p&gt;**赌书消得泼茶香，当时只道是寻常。**青州的14年，大概是他们一生中最安逸满足的时光了。&lt;/p&gt;&lt;p&gt;🌙 🌙 🌙&lt;/p&gt;&lt;p&gt;叁&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;风云变幻 · 聚少离多&lt;a href=&quot;#风云变幻--聚少离多&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元1121年 — 重阳佳节寄相思&lt;/p&gt;&lt;p&gt;&lt;strong&gt;公元1121年春天&lt;/strong&gt;，好消息传来——赵明诚被朝廷重新启用，任命为莱州郡守（相当于今天的市长）。可家里十几屋子的文物古董需要照看，加上两地相隔不远，李清照便独自留在了青州。&lt;/p&gt;&lt;p&gt;异地恋是考验人的事。平时还好，一到阖家团圆的日子，思念之情格外难耐。&lt;/p&gt;&lt;p&gt;这一年的重阳佳节，李清照独守空房，对着西风黄花，饮着苦酒，给远方的丈夫写下一首词：&lt;/p&gt;&lt;p&gt;《醉花阴·薄雾浓云愁永昼》&lt;/p&gt;&lt;p&gt;薄雾浓云愁永昼，瑞脑销金兽。&lt;/p&gt;&lt;p&gt;佳节又重阳，玉枕纱厨，半夜凉初透。&lt;/p&gt;&lt;p&gt;东篱把酒黄昏后，有暗香盈袖。&lt;/p&gt;&lt;p&gt;莫道不销魂，帘卷西风，人比黄花瘦。&lt;/p&gt;&lt;p&gt;“莫道不销魂，帘卷西风，人比黄花瘦”——千古名句&lt;/p&gt;&lt;p&gt;收到妻子的词，赵明诚读了一遍又一遍——写的真好啊！可怎么回复呢？这可愁坏了他。憋了整整三天，写了五十首《醉花阴》，信心满满：总有一首能比媳妇儿好吧？&lt;/p&gt;&lt;p&gt;可赵明诚啊，你清醒一点——这时候苏东坡已经去世了，辛弃疾还没出生，还能有谁和李清照比肩？写完之后他还专门拿给朋友看：“你最喜欢哪一首？“朋友看完来了句：**“莫道不销魂，帘卷西风，人比黄花瘦。这句实在是妙啊！“**赵明诚汗颜，发誓从此不再跟媳妇比写词。&lt;/p&gt;&lt;p&gt;然而，更深的裂痕正在悄然生长。作为一郡长官，身边总有温柔美人陪伴，赵明诚一度有了纳妾的想法——谁家还不养几个歌女侍妾呢？何况今年已经41岁了，还没有孩子。&lt;/p&gt;&lt;p&gt;在青州隐居时，两人身份平等、自由自在。但现在，赵明诚是有地位的人了，而李清照没有娘家撑腰、没有子嗣傍身。&lt;strong&gt;只要夫妻身份地位不平等，又异地分居，还没有孩子的维系，十有八九得出事儿。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;李清照何等聪慧敏锐，即使分隔两地也感觉出了不对劲。果然，当她风尘仆仆赶到莱州团聚时，迎接她的——是眼神躲闪的丈夫，和两个年轻的妾室。&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;“别觉得我孤单，我自己在这儿挺好的。我还有两个朋友呢——一个叫子虚，一个叫乌有。” ——李清照的自嘲，字字带血。&lt;/p&gt;&lt;p&gt;即使心中早已有了预感，当事实摆在眼前时，李清照还是一阵恍惚。&lt;strong&gt;20年恩爱夫妻，抵不过外面的灯红酒绿。曾经的海誓山盟还言犹在耳，如今眼前却多了两个如花美眷。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;纳妾在宋朝是常事，可这是李清照啊！她的才学和见识让她始终认为自己与丈夫是平等的。她可以从一而终，丈夫为什么不可以？这和合不合理无关——在她的婚姻世界里，很难接受第三者。&lt;/p&gt;&lt;p&gt;⚔️ ⚔️ ⚔️&lt;/p&gt;&lt;p&gt;肆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;国破家亡 · 颠沛流离&lt;a href=&quot;#国破家亡--颠沛流离&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元1127年 — 靖康之变 · 南渡逃亡&lt;/p&gt;&lt;p&gt;🏚️&lt;/p&gt;&lt;p&gt;靖康之耻：山河破碎，故土难返&lt;/p&gt;&lt;p&gt;相对于感情上的破裂，&lt;strong&gt;国家破碎的痛楚更加刻骨铭心。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;公元1127年&lt;/strong&gt;，金兵南下，靖康之变爆发。中国历史上从未有过如此狼狈的一幕——徽钦二帝被俘，北宋灭亡。国破家亡之际，先前所有的矛盾都变得微不足道了。关键时刻，老夫老妻依然是彼此最坚定的依靠。&lt;/p&gt;&lt;p&gt;两人分头行动：丈夫赵明诚去江宁（今南京）给母亲奔丧，后来做了江宁知府；李清照负责回青州收拾方便携带的贵重文物——&lt;strong&gt;那是他们辛苦积攒了20多年的心血啊。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;她独自带着十五车文物，颠沛流离在战火纷飞的路上。辗转途中，一个消息传来——江宁发生兵变，&lt;strong&gt;赵明诚作为父母官，没有保护百姓，也没有守住城池，反而弃城逃跑了！&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;那时候的宋朝，从上到下逃跑已成风气。可李清照看不上这个。万万没想到，自己的丈夫也会这样。&lt;strong&gt;太不爷们了，丢人啊！&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;🌊&lt;/p&gt;&lt;p&gt;乌江怀古：生当作人杰，死亦为鬼雄&lt;/p&gt;&lt;p&gt;带着十几车文物心事重重的李清照路过乌江时，面对浩荡江水，想到了那位拔剑自刎的西楚霸王项羽。她提笔写下：&lt;/p&gt;&lt;p&gt;《夏日绝句》（五绝）&lt;/p&gt;&lt;p&gt;生当作人杰，死亦为鬼雄。&lt;/p&gt;&lt;p&gt;至今思项羽，不肯过江东。&lt;/p&gt;&lt;p&gt;句句豪迈悲壮！一个弱女子就有如此胸襟气魄！&lt;/p&gt;&lt;p&gt;这首诗像一记响亮的耳光抽在了那个时代所有苟且偷生者的心上。&lt;/p&gt;&lt;p&gt;没过多久，李清照收到了丈夫病重的消息。她心急如焚，&lt;strong&gt;一夜行舟三百里&lt;/strong&gt;向丈夫奔去。可当她赶到的时候，赵明诚因为用药不当病入膏肓，已经撒手人寰。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;28年的婚姻，大半生的相依为命，白头之约终成空。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;即使夫妻之间曾有过龃龉，当面对真正的生死离别，爱总比恨浓烈。思之、悼之、悲之、痛之，李清照伤心至极，大病一场。&lt;/p&gt;&lt;p&gt;两人没有孩子。丈夫留下的&lt;strong&gt;两万多册古籍、两千多件碑刻文物&lt;/strong&gt;——就是他们的孩子。她要帮丈夫守着他们。&lt;/p&gt;&lt;p&gt;可这时候的李清照已经46岁了——一个年近半百的病弱寡妇，带着十几箱珍贵文物，在兵荒马乱中……你让她怎么守？强盗、山匪、官员，甚至邻居，谁都想分一杯羹。&lt;/p&gt;&lt;p&gt;战火中折腾了三年，这些文物被偷的偷、抢的抢、骗的骗，所剩无几了。&lt;/p&gt;&lt;p&gt;💔 💔 💔&lt;/p&gt;&lt;p&gt;伍&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;再嫁渣男 · 壮士断腕&lt;a href=&quot;#再嫁渣男--壮士断腕&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元1132年左右 — 49岁闪婚 · 百日离婚&lt;/p&gt;&lt;p&gt;疲惫、不安、孤独让两鬓斑白的李清照不堪重负，经常生病。就在这时，一个男人出现了——&lt;strong&gt;张汝舟&lt;/strong&gt;，一个地方小官，温文尔雅、端汤送药、嘘寒问暖，情意绵绵地把49岁的李清照宠成了小公主。&lt;/p&gt;&lt;p&gt;这样的暖男似乎让她看到了赵明诚的影子。逃亡的日子实在太苦太累太孤独了，架不住暖男天天缠磨，她同意了——&lt;strong&gt;闪婚。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;这个决定当然免不了被人指指点点：都五十岁了还二婚嫁人，真是不知羞耻！&lt;strong&gt;但李清照什么时候在乎过别人的眼光？&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;可婚姻就像一场豪赌。之前在牌桌上几乎没输过的李清照，这次——&lt;strong&gt;赌输了。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;刚结婚不久，张汝舟就撕下了温良的面具。原来他从一开始接近李清照就是为了那些价值连城的文物！当知道文物所剩无几且李清照坚决不给一分一毫时，达不到目的的张汝舟对李清照实施了&lt;strong&gt;家暴&lt;/strong&gt;，甚至还一度动了杀心！&lt;/p&gt;&lt;p&gt;“你不给我？等你死了你的东西都是我的！”&lt;/p&gt;&lt;p&gt;让他张汝舟也不打听打听——&lt;strong&gt;赵姐可不是吃素的！&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;李清照做出了一个惊人的决定：**离婚！**大才女结婚不到百日就要提出离婚，放到现代都是能上热搜的程度，更何况是在封建时代？！&lt;/p&gt;&lt;p&gt;让张汝舟主动和离？不可能，这种伪君子最会纠缠。宋朝法律规定：妻子告丈夫，即使罪名成立，自己也要坐牢两年。很多人劝她算了吧，忍忍就过去了。&lt;/p&gt;&lt;p&gt;但李清照是什么人？&lt;strong&gt;从年轻时就没弯过的腰，现在更不会折！坐牢就坐牢，这个婚我离定了！&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;收集证据&lt;/p&gt;&lt;p&gt;发现张汝舟靠弄虚作假当上官儿，一纸诉状告上公堂&lt;/p&gt;&lt;p&gt;案件结果&lt;/p&gt;&lt;p&gt;张汝舟被流放江西，据说连皇帝都惊动了&lt;/p&gt;&lt;p&gt;代价&lt;/p&gt;&lt;p&gt;李清照按律入狱九天后被亲友营救释放&lt;/p&gt;&lt;p&gt;走出监狱的那一刻，恍如隔世。物是人非事事休，欲语泪先流。&lt;/p&gt;&lt;p&gt;改嫁休夫这件事在当时成了李清照最大的污点。经过这场荒唐的婚变，本就多病缠身的她更加清瘦了。头发已经花白，脸上满是风霜，但她的眼睛依然炯炯有神，闪着寒光。&lt;/p&gt;&lt;p&gt;《声声慢·寻寻觅觅》&lt;/p&gt;&lt;p&gt;寻寻觅觅，冷冷清清，凄凄惨惨戚戚。&lt;/p&gt;&lt;p&gt;乍暖还寒时候，最难将息。&lt;/p&gt;&lt;p&gt;三杯两盏淡酒，怎敌他、晚来风急！&lt;/p&gt;&lt;p&gt;雁过也，正伤心，却是旧时相识。&lt;/p&gt;&lt;p&gt;满地黄花堆积，憔悴损，如今有谁堪摘？&lt;/p&gt;&lt;p&gt;守着窗儿，独自怎生得黑！&lt;/p&gt;&lt;p&gt;梧桐更兼细雨，到黄昏、点点滴滴。&lt;/p&gt;&lt;p&gt;这次第，怎一个愁字了得！&lt;/p&gt;&lt;p&gt;叠字开篇，字字泣血——这是她最夺目、也最令人心碎的作品&lt;/p&gt;&lt;p&gt;🕯️ 🕯️ 🕯️&lt;/p&gt;&lt;p&gt;陆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;孤灯残卷 · 笔耕不辍&lt;a href=&quot;#孤灯残卷--笔耕不辍&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;晚年 — 临安岁月 · 最后的光芒&lt;/p&gt;&lt;p&gt;📖&lt;/p&gt;&lt;p&gt;晚年李清照：孤灯下整理金石录后序&lt;/p&gt;&lt;p&gt;晚年的李清照投靠弟弟，一直生活在临安（今杭州）。&lt;/p&gt;&lt;p&gt;曾经名动天下的才女会怎样老去？她回忆着自己的前半生——童年的欢愉、少年的美满、破碎的家国、凄凉的晚景。丈夫的模样有些模糊了，她热爱的金石文物大多也已遗失。&lt;/p&gt;&lt;p&gt;可她没有放弃。&lt;strong&gt;趁着记忆还没褪色，趁着手指还能活动，她要完成丈夫未竟的事业。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;李清照开始回顾两人三十年来收集、整理、保护上万件金石字画的经历，写下了**《金石录后序》**。这篇文字多年后读起来依然让人潸然泪下——那是对逝去的丈夫最深情的告白，是对破碎的山河最沉痛的追忆，也是对自己一生最真实的写照。&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;《金石录后序》不仅仅是一篇学术文章，它是李清照用生命写就的爱情史诗。每一个字的背后，都是一段刻骨铭心的记忆，每一句话里，都藏着一个时代的眼泪。&lt;/p&gt;&lt;p&gt;七十岁那年，她遇见了一个邻家小女孩。那女孩聪颖活泼、有灵气，李清照看着她，就像看见了少女时的自己。于是她动了收徒的念头，想把自己毕生所学都交给这个小丫头。&lt;/p&gt;&lt;p&gt;“你要不要跟我读书写词啊？”&lt;/p&gt;&lt;p&gt;面对诗词大家的盛情邀请，小姑娘竟摇头拒绝了：&lt;/p&gt;&lt;p&gt;最后的对话&lt;/p&gt;&lt;p&gt;“我爹说了，写诗词不是女孩子该干的事。&lt;br /&gt;
您读了那么多书，又有什么用呢？”&lt;/p&gt;&lt;p&gt;这个问题让李清照怔住，久久无言&lt;/p&gt;&lt;p&gt;读书可以做官？可那是男人们的权利。&lt;/p&gt;&lt;p&gt;读书可以明理？可满朝文武哪个不是饱读诗书，却只求偏安一隅！&lt;/p&gt;&lt;p&gt;读书可以写诗词？可纵使自己这般文采风流，又怎敌它晚来风急？&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;✦ 终章：千古流芳 ✦&lt;a href=&quot;#-终章千古流芳-&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;公元1155年&lt;/strong&gt;，72岁的李清照躺在病榻之上。弥留之际，眼前闪过的是童年在藕花深处惊起的一滩鸥鹭，是与赵明诚赌书泼茶的欢笑，是国破家亡时漫天的烽火，是乌江边那句掷地有声的”生当作人杰”……最终定格在两年前那个小姑娘疑问的眼神里。&lt;/p&gt;&lt;p&gt;她想告诉她：&lt;strong&gt;读书有用。读书便可发声。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;男人由外而内构筑女性形象，而我们由内而外地表达自己——怎会一样呢？&lt;/p&gt;&lt;p&gt;“她用一生证明了：&lt;/p&gt;&lt;p&gt;才华不分性别，勇气无关年龄，&lt;/p&gt;&lt;p&gt;一个女人的灵魂，可以比时代更强大。”&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;📜 李清照生平大事记&lt;a href=&quot;#-李清照生平大事记&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1084年&lt;/p&gt;&lt;p&gt;出生于书香门第，父亲李格非为苏轼学生&lt;/p&gt;&lt;p&gt;约1100年&lt;/p&gt;&lt;p&gt;少年成名，《如梦令》轰动汴京文坛&lt;/p&gt;&lt;p&gt;1101年&lt;/p&gt;&lt;p&gt;21岁，与赵明诚结为夫妻&lt;/p&gt;&lt;p&gt;1107-1121年&lt;/p&gt;&lt;p&gt;青州隐居14年，完成《金石录》初稿&lt;/p&gt;&lt;p&gt;1121年&lt;/p&gt;&lt;p&gt;赵明诚赴莱州，感情出现裂痕&lt;/p&gt;&lt;p&gt;1127年&lt;/p&gt;&lt;p&gt;靖康之变，北宋灭亡，南渡逃亡&lt;/p&gt;&lt;p&gt;1129年&lt;/p&gt;&lt;p&gt;赵明诚病逝，46岁成为孀妇&lt;/p&gt;&lt;p&gt;约1132年&lt;/p&gt;&lt;p&gt;49岁再嫁张汝舟，百日内状告离婚&lt;/p&gt;&lt;p&gt;晚年&lt;/p&gt;&lt;p&gt;定居临安，完成《金石录后序》&lt;/p&gt;&lt;p&gt;约1155年&lt;/p&gt;&lt;p&gt;72岁，在临安辞世&lt;/p&gt;&lt;p&gt;🌸 千古第一才女李清照 · 一生感动无数后人 🌸&lt;/p&gt;&lt;p&gt;愿每个女子都能如她一般，活得热烈、真实、无畏&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>一生坎坷的伟大灵魂</title><link>https://firefly.cuteleaf.cn/posts/%E6%9D%9C%E7%94%AB/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E6%9D%9C%E7%94%AB/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;hr /&gt;
&lt;p&gt;诗圣杜甫：一生坎坷的伟大灵魂&lt;/p&gt;
&lt;section&gt;&lt;h1&gt;圣杜甫&lt;a href=&quot;#圣杜甫&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;一生坎坷 · 忧国忧民 · 诗史千秋&lt;/p&gt;&lt;p&gt;“安得广厦千万间，大庇天下寒士俱欢颜”&lt;/p&gt;&lt;p&gt;在中国文学浩瀚的长河中，有这样一位诗人：他生于盛唐繁华之世，却亲历安史之乱的腥风血雨；他才华盖世、志存高远，却一生仕途坎坷、穷困潦倒；他身处泥泞之中，心中却始终装着天下苍生。他就是被后世尊为”诗圣”的伟大诗人——杜甫。他的一千五百余首诗作，如同一部用血泪书写的史诗，记录了一个王朝由盛转衰的历史巨变，也映照出一个伟大灵魂在苦难中永不熄灭的光芒。&lt;/p&gt;&lt;p&gt;壹&lt;/p&gt;&lt;section&gt;&lt;h2&gt;少年壮志：书香门第的璀璨起点&lt;a href=&quot;#少年壮志书香门第的璀璨起点&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元712年 — 735年&lt;/p&gt;&lt;p&gt;唐睿宗先天元年（公元712年），杜甫出生于河南巩县（今河南巩义市）一个显赫的书香世家。他的祖父杜审言是初唐时期著名的诗人，官至修文馆直学士；父亲杜闲曾任奉天县令。在这样的家庭环境中，杜甫自幼便浸润在浓郁的文化氛围中，展现出惊人的天赋与对文学的热爱。&lt;/p&gt;&lt;p&gt;**📖 少年轶事：**据史料记载，杜甫七岁便能作诗，曾写下”凤凰鸣旭日，龙跃云汉津”这样气魄非凡的诗句。九岁时便已将大量经典诗文烂熟于心，十五岁时已在家乡文坛崭露头角，与当时的名士们诗文酬唱，被誉为”神童”。&lt;/p&gt;&lt;p&gt;青年时代的杜甫，意气风发，胸怀大志。他在一首回忆少年生活的诗中写道：“忆年十五心尚孩，健如黄犊走复来。庭前八月梨枣熟，一日上树能千回。“这生动描绘了他少年时代活泼好动、充满活力的形象。然而，杜甫并非只知玩耍的顽童，他更是一位有着远大抱负的读书人。“读书破万卷，下笔如有神”，这句后来成为千古名言的诗句，正是他对自己刻苦攻读生涯的真实写照。&lt;/p&gt;&lt;p&gt;岱宗夫如何？齐鲁青未了。&lt;/p&gt;&lt;p&gt;造化钟神秀，阴阳割昏晓。&lt;/p&gt;&lt;p&gt;荡胸生曾云，决眦入归鸟。&lt;/p&gt;&lt;p&gt;会当凌绝顶，一览众山小。&lt;/p&gt;&lt;p&gt;——《望岳》· 杜甫（二十四岁时登泰山所作）&lt;/p&gt;&lt;p&gt;开元十九年至二十三年（731—735年），年轻的杜甫开始了人生中的第一次远游。他漫游吴越（今江苏、浙江一带），足迹遍及江南山水之间。这次游历不仅开阔了他的眼界，也让他饱览了祖国的大好河山，为他日后的诗歌创作积累了丰富的素材和情感体验。二十岁时，他又来到当时的东都洛阳，在那里度过了四年的时光，结识了许多文人雅士，进一步提升了文学修养。&lt;/p&gt;&lt;p&gt;开元二十四年（736年），二十四岁的杜甫来到山东，登上五岳之首的泰山。面对巍峨雄伟的泰山，这位年轻诗人豪情万丈，挥笔写下了那首脍炙人口的《望岳》。其中”会当凌绝顶，一览众山小”两句，不仅是对泰山壮美景色的赞美，更是年轻杜甫远大志向的自我写照——他要登上人生和艺术的最高峰，俯瞰世间一切艰难险阻！&lt;/p&gt;&lt;p&gt;📜 少年杜甫苦读诗书 —— “读书破万卷，下笔如有神”&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;贰&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;长安十年：梦想与现实的残酷碰撞&lt;a href=&quot;#长安十年梦想与现实的残酷碰撞&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元735年 — 755年&lt;/p&gt;&lt;p&gt;开元二十三年（735年），二十四岁的杜甫第一次参加进士考试。然而，命运似乎有意要考验这位天才——他落榜了。这次失利并没有让杜甫气馁，相反，他选择继续漫游，充实自己。此后几年，他游历齐赵大地，过着”放荡齐赵间，裘马颇清狂”的生活。这一时期，他与好友李白相识，两位伟大的诗人在洛阳相遇，结下了深厚的友谊。李白比杜甫大十一岁，当时已是名满天下的大诗人，而杜甫还是一位默默无闻的后辈。但两人一见如故，携手同游梁宋一带，饮酒赋诗，畅谈理想。这段珍贵的友谊成为中国文学史上最动人的佳话之一。&lt;/p&gt;&lt;p&gt;**🤝 李杜之交：**天宝三载（744年），杜甫与李白在洛阳初次相见。两人一起游历梁宋（今河南商丘、开封一带）、齐鲁等地，“醉眠秋共被，携手日同行”。尽管相处时间不长，但这份真挚的友情影响了杜甫的一生，他后来写下了许多怀念李白的动人诗篇。&lt;/p&gt;&lt;p&gt;然而，美好的日子终究是短暂的。天宝五载（746年），三十五岁的杜甫怀着满腔热忱来到长安，希望能在政治上有所作为。他以为凭借自己的才华和家族背景，一定能够获得朝廷的重用，实现”致君尧舜上，再使风俗淳”的政治理想。但他万万没想到，这一待就是整整十年，而等待他的却是接二连三的打击与失望。&lt;/p&gt;&lt;p&gt;长安十年是杜甫人生中最黑暗、最痛苦的时期之一。当时的朝政已被权相李林甫把持，科举制度形同虚设。天宝六载（747年），唐玄宗下诏选拔天下贤才，杜甫满怀希望地参加，结果李林甫为了独揽大权，竟然上奏称”野无遗贤”，让所有应试者全部落榜。这对杜甫来说无疑是晴天霹雳。&lt;/p&gt;&lt;p&gt;747年&lt;/p&gt;&lt;p&gt;应诏试而落榜，李林甫以”野无遗贤”蒙蔽皇帝，杜甫的政治梦想首次遭受重创&lt;/p&gt;&lt;p&gt;751年&lt;/p&gt;&lt;p&gt;向玄宗进献《三大礼赋》，得到赏识，命待制集贤院，但仍未获实际任用&lt;/p&gt;&lt;p&gt;755年&lt;/p&gt;&lt;p&gt;四十四岁终于获得右卫率府胄曹参军的小官，负责看守兵器钥匙，俸禄微薄&lt;/p&gt;&lt;p&gt;在长安的漫长岁月里，杜甫的生活日益困顿。他不得不依靠亲友的接济维持生计，甚至一度寄居在大女婿家中，过着寄人篱下的生活。他曾写道：“朝扣富儿门，暮随肥马尘。残杯与冷炙，到处潜悲辛。“这几句诗真实地记录了他当年在长安四处碰壁、饱受冷眼的屈辱经历。一个曾经意气风发的才子，如今竟沦落到如此境地，其中的辛酸与无奈可想而知。&lt;/p&gt;&lt;p&gt;然而，正是这段痛苦的经历，使杜甫真正接触到了底层人民的生活，深刻体会到了社会的不公与黑暗。他的诗歌风格开始发生转变，从早期的浪漫主义逐渐转向现实主义。他开始关注普通人的疾苦，用自己的笔触记录社会的真相，为那些被遗忘的人发出声音。长安十年虽然摧毁了杜甫的政治梦想，但却成就了一位伟大的现实主义诗人。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;叁&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;安史之乱：家国破碎的血泪岁月&lt;a href=&quot;#安史之乱家国破碎的血泪岁月&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元755年 — 759年&lt;/p&gt;&lt;p&gt;天宝十四载（755年）十一月，范阳节度使安禄山起兵反唐，安史之乱爆发。这场持续八年之久的战乱彻底改变了大唐帝国的命运，也彻底改变了杜甫的人生轨迹。当时，杜甫将家人安置在鄜州（今陕西富县）的羌村，独自北上灵武投奔新即位的唐肃宗，想要为国效力。不幸的是，他在途中被叛军俘获，押解回长安。&lt;/p&gt;&lt;p&gt;国破山河在，城春草木深。&lt;/p&gt;&lt;p&gt;感时花溅泪，恨别鸟惊心。&lt;/p&gt;&lt;p&gt;烽火连三月，家书抵万金。&lt;/p&gt;&lt;p&gt;白头搔更短，浑欲不胜簪。&lt;/p&gt;&lt;p&gt;——《春望》· 杜甫（被囚长安时所作）&lt;/p&gt;&lt;p&gt;在被叛军软禁的长安城中，杜甫目睹了昔日繁华的京城沦为废墟的惨状。曾经热闹非凡的大街小巷如今杂草丛生，昔日的歌舞升平变成了断壁残垣。这种强烈的对比让杜甫心如刀绞，他含泪写下了千古绝唱《春望》。“国破山河在，城春草木深”——短短十个字，道尽了对国家命运的深切忧虑和个人身世的无限感慨。“烽火连三月，家书抵万金”则表达了对远方家人的深切思念和对和平的渴望。这首诗不仅是杜甫个人情感的抒发，更是整个民族在那个动荡年代共同心声的表达。&lt;/p&gt;&lt;p&gt;至德二载（757年）夏，杜甫冒险逃出长安，穿过叛军的重重封锁，历经千难万险，终于抵达凤翔（今陕西凤翔）行在所。唐肃宗对他的忠诚深感欣慰，任命他为左拾遗。这是杜甫一生中担任过的最高官职，也是他离政治理想最近的一次。然而好景不长，仅仅几个月后，因为营救房琯一事触怒肃宗，杜甫遭到贬斥，从此再未受到重用。&lt;/p&gt;&lt;p&gt;乾元二年（759年），杜甫辞去华州司功参军的职务，开始了更为艰辛的流亡生活。他携全家西行，先后流寓秦州（今甘肃天水）、同谷（今甘肃成县）等地。这是一段极其艰苦的旅程，一路上饥寒交迫，甚至到了靠挖掘野生植物充饥的地步。他在《秦州杂诗》中描述当时的处境：“满目悲生事，因人作远游。西征问烽火，心折此淹留。“字里行间充满了无尽的凄凉与无奈。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;📜 “三吏三别”——战争最真实的写照：&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;在这一时期，杜甫创作了中国文学史上最杰出的现实主义组诗——“三吏”（《石壕吏》《潼关吏》《新安吏》）和”三别”（《新婚别》《垂老别》《无家别》）。这些诗歌以第一人称或第三人称的视角，深刻揭露了战争给百姓带来的深重灾难。《石壕吏》中有这样的描写：“吏呼一何怒！妇啼一何苦！“老翁逾墙走，老妇出门看。差役的凶残暴虐与百姓的无助绝望形成了强烈对比，读来令人潸然泪下。&lt;/p&gt;&lt;p&gt;在从华州前往秦州的途中，杜甫亲眼目睹了无数百姓因战争而家破人亡的惨剧。他在《石壕吏》中记录了一户农家在深夜遭遇差役抓丁的场景：老翁翻墙逃跑，老妇硬着头皮出门应对。最终，老妇被带走服役，留下老弱病残的一家老小相依为命。这首诗没有一句议论，只是冷静地叙述事件的经过，但其蕴含的情感力量却足以震撼每一个读者的心灵。这正是杜甫诗歌最了不起的地方——他用最朴素的语言，讲述最震撼人心的故事。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;肆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;成都草堂：风雨中的短暂安宁&lt;a href=&quot;#成都草堂风雨中的短暂安宁&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元759年 — 768年&lt;/p&gt;&lt;p&gt;乾元二年（759年）年底，在经历了漫长的颠沛流离之后，杜甫带着家人来到了成都。在这里，在朋友严武等人的帮助下，他在成都西郊浣花溪畔建起了一座简陋的茅草屋，这就是后来闻名天下的”杜甫草堂”（又称”浣花草堂”）。对于漂泊多年的杜甫来说，这间小小的草屋意味着难得的安宁与稳定。&lt;/p&gt;&lt;p&gt;成都时期是杜甫晚年生活中相对平静的一段时光。这里气候温和、物产丰富，远离了北方的战火硝烟。在这段时间里，杜甫创作了大量优秀的作品，《春夜喜雨》《蜀相》《客至》《江村》等名篇都是这一时期的产物。《春夜喜雨》中”好雨知时节，当春乃发生。随风潜入夜，润物细无声”几句，以细腻的笔触描绘了春夜降雨的美景，表达了诗人对自然万物生长的喜悦之情。这首诗语言清新自然，意境优美，千百年来一直深受人们的喜爱。&lt;/p&gt;&lt;p&gt;八月秋高风怒号，卷我屋上三重茅。&lt;/p&gt;&lt;p&gt;茅飞渡江洒江郊，高者挂罥长林梢，&lt;/p&gt;&lt;p&gt;下者飘转沉塘坳……&lt;/p&gt;&lt;p&gt;安得广厦千万间，&lt;/p&gt;&lt;p&gt;大庇天下寒士俱欢颜！&lt;/p&gt;&lt;p&gt;风雨不动安如山。&lt;/p&gt;&lt;p&gt;呜呼！&lt;/p&gt;&lt;p&gt;何时眼前突兀见此屋，&lt;/p&gt;&lt;p&gt;吾庐独破受冻死亦足！&lt;/p&gt;&lt;p&gt;——《茅屋为秋风所破歌》· 节选&lt;/p&gt;&lt;p&gt;然而，即便是在这短暂的安宁时刻，杜甫依然无法忘记天下苍生的疾苦。上元二年（761年）秋天的一个夜晚，狂风骤起，吹破了杜甫草堂的屋顶。大雨倾盆而下，漏得屋里没有一块干燥的地方。全家人蜷缩在被雨水打湿的被褥里，瑟瑟发抖。面对这样的困境，普通人可能会怨天尤人或哀叹自己的不幸，但杜甫想到的却是普天下所有像自己一样遭受苦难的人。&lt;/p&gt;&lt;p&gt;“安得广厦千万间，大庇天下寒士俱欢颜！“——这是何等的博大胸怀！在自己最困难的时候，杜甫关心的不是个人的得失，而是千千万万个与自己一样贫苦的知识分子能否有一个遮风避雨的地方。“何时眼前突兀见此屋，吾庐独破受冻死亦足！“他宁愿自己一个人承受所有的苦难，也希望所有人都能过上幸福的生活。这种推己及人、舍己为人的精神，让一千多年后的我们依然为之动容。这就是杜甫之所以被称为”诗圣”的原因——他不仅仅是一个伟大的诗人，更是一个拥有伟大人格和高尚情操的人！&lt;/p&gt;&lt;p&gt;广德二年（764年），经严武推荐，杜甫担任检校工部员外郎，因此后世也称他为”杜工部”。这是杜甫最后一次出仕。然而，由于身体状况和政治环境的原因，他在这个职位上没待多久就辞职了。永泰元年（765年）四月，严武病逝，杜甫失去了在成都最大的依靠。五月，他带着家人离开了居住了近六年的草堂，再次踏上了漂泊之路。&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;p&gt;伍&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;漂泊西南：生命最后的孤独旅程&lt;a href=&quot;#漂泊西南生命最后的孤独旅程&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元768年 — 770年&lt;/p&gt;&lt;p&gt;离开成都之后，杜甫的生命进入了最后的阶段。他先是乘船沿长江东下，经过嘉州（今四川乐山）、戎州（今四川宜宾）、渝州（今重庆）、夔州（今重庆奉节）等地，最终到达夔州并在此居住了将近两年时间。夔州时期是杜甫创作的又一个高峰期，他在此期间创作了约四百首诗歌，包括《秋兴八首》《登高》等代表作。&lt;/p&gt;&lt;p&gt;风急天高猿啸哀，渚清沙白鸟飞回。&lt;/p&gt;&lt;p&gt;无边落木萧萧下，不尽长江滚滚来。&lt;/p&gt;&lt;p&gt;万里悲秋常作客，百年多病独登台。&lt;/p&gt;&lt;p&gt;艰难苦恨繁霜鬓，潦倒新停浊酒杯。&lt;/p&gt;&lt;p&gt;——《登高》· 杜甫（夔州时期代表作）&lt;/p&gt;&lt;p&gt;《登高》被公认为杜甫最杰出的作品之一，也是中国古典诗歌中七言律诗的巅峰之作。“无边落木萧萧下，不尽长江滚滚来”这两句，以宏大的时空视角展现了自然的永恒与人生的渺小，意境深远，气势磅礴。而”万里悲秋常作客，百年多病独登台”则浓缩了杜甫一生的悲剧经历——万里漂泊、暮年作客、多病缠身、佳节登高、无人陪伴……短短十四个字包含了八重悲愁，令人读来不禁扼腕叹息。&lt;/p&gt;&lt;p&gt;大历三年（768年），杜甫再次踏上旅途，乘船出三峡，继续向东漂泊。此时的他已经是一个风烛残年的老人，疾病缠身，贫困交加。他先后辗转于江陵（今湖北荆州）、公安（今湖北公安）等地，最终于大历四年（769年）抵达潭州（今湖南长沙）和衡州（今湖南衡阳）。这一路上，杜甫的生活极为艰难，有时甚至需要靠乞讨度日。他在诗中写道：“饥借家家米，愁征处处杯。“可见其境遇之窘迫。&lt;/p&gt;&lt;p&gt;768年&lt;/p&gt;&lt;p&gt;离开夔州，乘舟出峡，开始最后的漂泊旅程&lt;/p&gt;&lt;p&gt;769年&lt;/p&gt;&lt;p&gt;辗转潭州、衡州等地，生活极度贫困，疾病缠身&lt;/p&gt;&lt;p&gt;770年&lt;/p&gt;&lt;p&gt;冬，在由潭州往岳阳的一条小船上病逝，享年五十九岁&lt;/p&gt;&lt;p&gt;大历五年（770年）四月，潭州发生兵乱，杜甫再次被迫逃亡。他原本计划前往郴州投靠亲戚，但在逆流而上的途中遭遇洪水，被困在耒阳一带数天，几乎饿死。幸亏有县令送来牛肉和白酒，他才得以活下来。然而，这次劫难严重损害了本就虚弱的身体。杜甫改变了计划，顺流而下返回潭州。&lt;/p&gt;&lt;p&gt;大历五年（770年）冬天，杜甫在一条由潭州驶往岳阳的小船上永远地闭上了双眼，享年五十九岁。据记载，他临终前的最后时刻仍然在吟诗。这位伟大的诗人就这样在贫穷与疾病中结束了他坎坷的一生。他死后，家人无力将其归葬故乡，只能临时将他安葬在岳阳。直到四十三年后（813年），他的孙子杜嗣业才将他的灵柩迁回故乡河南偃师，与夫人杨氏合葬。&lt;/p&gt;&lt;p&gt;**🏛️ 绝唱：**杜甫生前最后一首重要作品是《登岳阳楼》。当时他途经岳阳，登上著名的岳阳楼，面对浩瀚的洞庭湖，写下了”吴楚东南坼，乾坤日夜浮”的千古名句。这首诗既写出了洞庭湖气象万千的壮观景象，也隐含了诗人对国家破碎、身世飘零的深沉感伤。一个即将走到生命终点的老人，面对浩瀚的湖山，心中装的依然是家国天下——这就是杜甫，这就是诗圣！&lt;/p&gt;&lt;p&gt;✦ ✦ ✦&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;千秋诗圣 万古流芳&lt;a href=&quot;#千秋诗圣-万古流芳&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;回顾杜甫的一生，我们看到的是一部充满苦难与奋斗的史诗。他生于盛唐，却经历了唐朝由极盛转向衰落的全过程；他有旷世之才，却一生怀才不遇、穷困潦倒；他自身难保，却始终心怀天下苍生。正是这些看似矛盾的因素，造就了中国文学史上独一无二的”诗圣”。&lt;/p&gt;&lt;p&gt;杜甫留给我们的，不仅仅是一千五百多首优秀的诗歌，更是一种崇高的人格力量和精神境界。在他身上，我们看到了什么是真正的忧国忧民，什么是推己及人的博大情怀，什么是在逆境中坚守理想的执着精神。他的诗歌被誉为”诗史”，因为他忠实地记录了自己所处的时代；他被尊为”诗圣”，因为他用生命诠释了什么是真正的文人风骨。&lt;/p&gt;&lt;p&gt;一千二百多年过去了，当我们今天重新诵读杜甫的诗篇时，依然会被其中蕴含的深厚情感所打动。“朱门酒肉臭，路有冻死骨”——对社会不公的控诉至今振聋发聩；“安得广厦千万间，大庇天下寒士俱欢颜”——对他人的关怀依然温暖人心；“无边落木萧萧下，不尽长江滚滚来”——对宇宙人生的思考依然启迪着我们。杜甫的精神早已融入中华民族的文化血脉之中，成为我们宝贵的精神财富。&lt;/p&gt;&lt;p&gt;✍️ 文章整理 | 诗圣杜甫生平传记&lt;/p&gt;&lt;p&gt;“文章千古事，得失寸心知。” —— 致敬伟大的诗圣杜甫&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>苏轼与苏辙：千年兄弟情的传奇</title><link>https://firefly.cuteleaf.cn/posts/%E8%8B%8F%E8%BD%BC/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E8%8B%8F%E8%BD%BC/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;苏轼与苏辙&lt;a href=&quot;#苏轼与苏辙&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;p&gt;千年兄弟情的传奇&lt;/p&gt;&lt;p&gt;“与君世世为兄弟，更结来生未了因”&lt;/p&gt;&lt;p&gt;在中国文学史上，有这样一对兄弟，他们的名字永远镌刻在唐宋八大家的丰碑之上。哥哥苏轼，字子瞻，号东坡居士，是北宋最耀眼的文学巨星；弟弟苏辙，字子由，官至副宰相，是沉稳内敛的政治家。他们相差两岁，却携手走过了一生中最跌宕起伏的岁月。&lt;/p&gt;&lt;p&gt;苏轼和苏辙谁更厉害？这个问题本身就错了。他们从来不是竞争对手，而是彼此生命中最坚实的依靠。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;壹&lt;/p&gt;&lt;section&gt;&lt;h2&gt;名字里的深意&lt;a href=&quot;#名字里的深意&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;公元1037年1月8日，苏轼出生。两年后的1039年3月18日，苏辙降临人世。他们的父亲苏洵，一位大器晚成的文学家，为两个儿子取了意味深长的名字。&lt;/p&gt;&lt;p&gt;轼&lt;/p&gt;&lt;section&gt;&lt;h3&gt;苏轼 · 字子瞻&lt;a href=&quot;#苏轼--字子瞻&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;**“轼”&lt;strong&gt;是古代马车前方的横木，看似没什么作用，但去掉它，整个车就不完整。父亲担心苏轼不懂得隐藏锋芒，希望他能学会收敛自己。&lt;/strong&gt;“子瞻”**意为扶着把手向远处眺望，凡事多看多想，三思而后行。&lt;/p&gt;&lt;p&gt;辙&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;苏辙 · 字子由&lt;a href=&quot;#苏辙--字子由&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;**“辙”&lt;strong&gt;是马车留下的车轮印，一旦车毁人亡，车轮印却可以免于灾祸。苏辙性格内敛，父亲希望他&lt;/strong&gt;”由”**着心来，放心大胆地往前走，在取得成就的同时，又能免于灾祸。&lt;/p&gt;&lt;p&gt;知子莫若父。苏洵对两个儿子的定位精准得令人叹服——一个光芒四射却需懂得收敛，一个沉稳内敛却能明哲保身。后来的历史证明，这位老父亲的预判分毫不差。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;贰&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;少年成名 同登进士&lt;a href=&quot;#少年成名-同登进士&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1056年，年仅19岁的苏轼和17岁的苏辙，在父亲苏洵的带领下，踏上了前往京城参加科举考试的漫漫征途。这是兄弟俩第一次远离家乡，也是他们辉煌人生的起点。&lt;/p&gt;&lt;p&gt;1056年 · 科举及第&lt;/p&gt;&lt;p&gt;兄弟俩双双考中进士，相当于今天的博士学位。主考官欧阳修对苏轼的文章给予了极高的评价，称其”他日文章必独步天下”。苏轼自此名声大噪，震动京师。&lt;/p&gt;&lt;p&gt;1061年 · 制科考试&lt;/p&gt;&lt;p&gt;通过欧阳修推荐，兄弟俩参加最高级别的制科考试，再次同时被录取。苏轼获得第三等，被称为”百年第一人”，被皇帝亲自看见，开启了仕途之路。&lt;/p&gt;&lt;p&gt;当朝大臣张方平曾这样评价两兄弟：“哥哥性格开朗，将来一定是人见人爱；弟弟性格严谨，将来的成就或许比哥哥还高。“后来的发展，果然如他所言。&lt;/p&gt;&lt;p&gt;上任的第一天，想弟弟；路过同游的地方，想弟弟；想到离弟弟这么远，想弟弟……&lt;/p&gt;&lt;p&gt;—— 苏轼给苏辙的信&lt;/p&gt;&lt;p&gt;从踏入仕途的第一天起，苏轼就开始了给弟弟写信的”日常”。出差写信，放假游玩也写信，实在不过瘾，就直接画亭台池院给弟弟分享。他在信中发出感慨：天下谁也没有他弟弟好。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;叁&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;乌台诗案 生死与共&lt;a href=&quot;#乌台诗案-生死与共&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1066年，父亲苏洵去世。两兄弟守孝三年后回到朝廷，却正值王安石推行变法。由于对变法持有异议，兄弟俩双双被贬离京。1076年中秋，已经七年没有团聚的苏轼，望着明月写下了那首传唱千古的《水调歌头》：&lt;/p&gt;&lt;section&gt;&lt;h4&gt;水调歌头 · 明月几时有&lt;a href=&quot;#水调歌头--明月几时有&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;但愿人长久，千里共婵娟。&lt;/p&gt;&lt;p&gt;四年后，苏辙写下《逍遥堂会宿》，回忆与哥哥从小一起读书、没有一天分开的日子。他们相约：老了要住在一起，“安知风雨夜，复此对床眠”。&lt;/p&gt;&lt;p&gt;1079年，苏轼被调任时给皇帝写了一封感谢信，却因言语中嘲讽新政而触怒龙颜。皇帝下令对其诗作进行全面调查，酿成了著名的”乌台诗案”。&lt;/p&gt;&lt;p&gt;哥哥进了大牢，眼看性命不保。在狱中，苏轼给弟弟写下绝命诗：&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;狱中寄子由&lt;a href=&quot;#狱中寄子由&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;与君世世为兄弟，&lt;/p&gt;&lt;p&gt;更结来生未了因。&lt;/p&gt;&lt;p&gt;意思是：自己死了不要紧，随便找个地方埋了就是。但想到之前和弟弟的约定，以后怕是只能留弟弟一个人悲伤了，希望来生还能做兄弟，再续这份情谊。&lt;/p&gt;&lt;p&gt;而苏辙这边，心痛不已。他请求用自己的官职为哥哥赎罪——这是何等的兄弟情深！最终，被囚禁了130天的苏轼出狱了，小命算是保住，但兄弟俩再次双双被贬。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;肆&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;黄岁月 患难真情&lt;a href=&quot;#黄岁月-患难真情&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1080年，苏轼来到被贬之地黄州。这里的日子贫苦不堪，但苏轼以他特有的豁达，在逆境中活出了诗意。&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;**东坡居士的由来：**第二年，为了不饿肚子，苏轼在东坡外的山坡上种了十亩地，从此自称”东坡居士”。&lt;/li&gt;
&lt;li&gt;**东坡肉的发明：**第三年，为了省钱，他发明了著名的东坡肉。在明朝之前，猪肉被视为贱肉，非常便宜，这让贫困中的苏轼也能吃上肉。&lt;/li&gt;
&lt;li&gt;**文学创作的高峰：**这四年间，苏轼留下了100多首诗，占他一生作品的四分之一。正是这段被贬的岁月，成就了他文学创作的巅峰。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;在这四年里，兄弟俩来往信件频繁。苏辙叮嘱哥哥照顾身体、少喝酒；苏轼则告诉弟弟：不高兴了，大不了就不干了，来找我，咱们一起安家听雨。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;伍&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;仕途分野 守护之情&lt;a href=&quot;#仕途分野-守护之情&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1085年，高太后上台打压王安石变法，苏轼、苏辙再次被启用，兄弟俩总算在京师重逢。然而好景不长——苏轼在被贬期间认识到王安石变法的某些好处，开始攻击高太后欣赏的司马光，于是又一次被贬。&lt;/p&gt;&lt;p&gt;这一次，两兄弟的仕途出现了分野：&lt;/p&gt;&lt;p&gt;轼&lt;/p&gt;&lt;section&gt;&lt;h3&gt;苏轼 · 造福一方&lt;a href=&quot;#苏轼--造福一方&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;在被贬期间，苏轼治理西湖，留下了苏堤春晓、三潭印月等传世美景。他每到一处，都全心投入造福百姓。&lt;/p&gt;&lt;p&gt;辙&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;苏辙 · 位极人臣&lt;a href=&quot;#苏辙--位极人臣&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;苏辙深得高太后倚重，一路升职加薪，成为位高权重的副宰相。仿佛在用行动告诉哥哥：只有我一直往上爬，才能更好地守护你。&lt;/p&gt;&lt;p&gt;1094年，新党再次上台，兄弟俩又双双被贬。57岁的苏轼被贬到广东惠州，苏辙去了江西。即便到了这个年纪，苏轼依然没有破罐子破摔，反而随遇而安，在惠州两年间为当地百姓做了无数好事：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;**提高农业生产力：**改善当地的插秧模式，提高农作物产量。&lt;/li&gt;
&lt;li&gt;**帮助百姓创收：**建议村民利用溪流落差建造水碓水磨，将檀香、樟木等研成粉销往广州等地。&lt;/li&gt;
&lt;li&gt;**为百姓安全建桥：**建议修建两桥一堤，资金不足时动员弟弟弟媳捐款，这就是后来的”苏公堤”。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;就在哥哥忙着造福百姓、没空给弟弟写信的时候，苏辙来信催促：“快过年了，哥哥别忘了寄新诗词给我！”&lt;/p&gt;&lt;p&gt;—— 苏辙来信&lt;/p&gt;&lt;p&gt;苏轼回复：“我忙着造福百姓呢，而且我又发明了美食羊蝎子！“——即便在最艰难的时刻，这对兄弟依然保持着乐观与温情。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;陆&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;海南岁月 文化播种&lt;a href=&quot;#海南岁月-文化播种&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1097年，两兄弟再次被贬。这一次，苏轼被贬到了海南海口——在宋朝，放逐海南是比满门抄斩罪轻一等的处罚。1000年前的海南，是”中原人去海南，十去九不还”的荒蛮之地。&lt;/p&gt;&lt;p&gt;在前往被贬之地的路上，两兄弟心中都清楚：无论从年龄还是看不到头的被贬之路来看，这都有可能是他们最后在一起的日子了。&lt;/p&gt;&lt;p&gt;然而，即便到了海南，生活如此艰难，苏轼却以一己之力给海南带来了文化繁荣：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;**创办海南第一所学堂：**他带领百姓盖学堂、做老师，把荒蛮之地变成了书声朗朗、弦歌四起的文化中心。不久后，海南就有了第一位进士。&lt;/li&gt;
&lt;li&gt;**发明海南第一块墨：**用树枝烧成灰，混合牛皮胶制成。&lt;/li&gt;
&lt;li&gt;**贡献海南第一个插秧机：**挖了第一口水井，开办了第一家医院，亲自当医生救死扶伤。&lt;/li&gt;
&lt;/ul&gt;&lt;section&gt;&lt;h4&gt;苏轼·诗&lt;a href=&quot;#苏轼诗&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;沧海何曾断地脉，&lt;/p&gt;&lt;p&gt;朱崖从此破天荒。&lt;/p&gt;&lt;p&gt;一个荒蛮之地完成了科举零突破，这确实称得上是”破天荒”。当地百姓对苏东坡简直是膜拜——他们对帝王将相都没有兴趣，却因为能拥有”我们的苏东坡”而自豪。&lt;/p&gt;&lt;p&gt;流传至今的东坡村、东坡井、东坡田、东坡路、东坡桥、东坡帽……都表达了当地人对他的尊敬和缅怀。这就是文化的力量——读的书多、学问多，自然就懂得多，走到哪里都能造福一方。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;柒&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;生死离别 终成永恒&lt;a href=&quot;#生死离别-终成永恒&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;1100年，新皇帝继位，兄弟俩再次被启用。他们非常高兴，因为那个”对床饮酒听雨声”的愿望马上就要实现了。&lt;/p&gt;&lt;p&gt;然而，命运弄人。1101年8月24日，苏轼在北归途中重病逝世，享年66岁。&lt;/p&gt;&lt;p&gt;唯吾子由，不及一见而绝，死痛难堪。&lt;/p&gt;&lt;p&gt;—— 苏轼临终遗言&lt;/p&gt;&lt;p&gt;临终前，苏轼遗憾地写下：只有子由，来不及见最后一面就要走了，这种痛苦难以承受。&lt;/p&gt;&lt;p&gt;苏辙得知哥哥过世，悲痛不已，为哥哥写下：&lt;/p&gt;&lt;p&gt;手足之爱，平生一人。&lt;/p&gt;&lt;p&gt;—— 苏辙祭文&lt;/p&gt;&lt;p&gt;11年后，苏辙去世，他们葬在了一处。此时，他们终于实现了年少时的约定：&lt;/p&gt;&lt;section&gt;&lt;h4&gt;终成现实&lt;a href=&quot;#终成现实&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;安知风雨夜，&lt;/p&gt;&lt;p&gt;复此对床眠。&lt;/p&gt;&lt;p&gt;* * *&lt;/p&gt;&lt;p&gt;捌&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;千古流芳 兄弟典范&lt;a href=&quot;#千古流芳-兄弟典范&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;苏辙，唐宋八大家之一，北宋文学家，好丈夫，一生未纳妾。&lt;/p&gt;&lt;p&gt;苏轼，唐宋八大家之一，北宋文学家、书法家、画家，光芒万丈的文化巨星。&lt;/p&gt;&lt;p&gt;唐宋八大家之中，光他们家就占了三个——还有他们的父亲苏洵。这一家人，是真厉害！&lt;/p&gt;&lt;p&gt;论仕途，苏辙的官位高；论对百姓的贡献，苏轼更高。&lt;/p&gt;&lt;p&gt;他为人谨慎，他为人洒脱。&lt;/p&gt;&lt;p&gt;他喜欢被贬的每一个地方，就连他只待过5天的登州，也有”五天登州府，千年苏公祠”的后话。&lt;/p&gt;&lt;p&gt;苏轼不管被贬到哪里，都能活下去，而且可以快乐地活下去。他能享受命运的馈赠，也能承担命运的打击。这两兄弟都在各自擅长的地方发光，做了最好的自己。&lt;/p&gt;&lt;p&gt;《宋史》记载了两个人的兄弟情，用了四个字：“禁锢罕见”。&lt;/p&gt;&lt;p&gt;大家都说”大难临头各自飞”，但他们始终相互扶持，在他们身上没有看到对对方的一点怨言。这是难得的兄弟情谊，是千古传颂的典范。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;✦ 尾声 ✦&lt;a href=&quot;#-尾声-&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;苏轼与苏辙的故事告诉我们：&lt;/p&gt;&lt;p&gt;真正的兄弟，不是比较谁更厉害，&lt;/p&gt;&lt;p&gt;而是在彼此的生命中，成为最坚实的依靠。&lt;/p&gt;&lt;p&gt;愿我们都能拥有这样的情谊，&lt;/p&gt;&lt;p&gt;愿天下有情人，都能”但愿人长久，千里共婵娟”。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>千古第一意难平-陆游与唐婉的爱情故事</title><link>https://firefly.cuteleaf.cn/posts/%E9%99%86%E6%B8%B8/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E9%99%86%E6%B8%B8/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;&lt;strong&gt;千古第一意难平&lt;/strong&gt;   陆游与唐婉的爱情故事&lt;/p&gt;
&lt;p&gt;有些爱，赢了时光，却输了世俗&lt;/p&gt;
&lt;p&gt;有些成全，暖了岁月，却敌不过一句故人难忘&lt;/p&gt;
&lt;p&gt;世人皆知钗头凤，少有人怜赵士诚。&lt;/p&gt;
&lt;p&gt;我们总说爱能抵万难，可读完这两首词以及三个人的故事，才懂——&lt;strong&gt;有些爱，赢了时光，却输了世俗；有些成全，暖了岁月，却敌不过一句故人难忘。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;为什么陆游的一句”错错错”能让唐婉抑郁而终？赵士诚的极致深情又为何鲜少被人提及？&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;壹&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;凤钗定情&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;那年春风恰好&lt;/p&gt;
&lt;p&gt;南宋绍兴年间，越州山阴（今浙江绍兴），有一对璧人。&lt;/p&gt;
&lt;p&gt;陆游，字务观，出身书香门第，少年便负才名；唐婉，字蕙仙，自幼聪慧灵秀，精通诗词文墨。两家本为世交，二人自幼便在彼此的视线里长大——&lt;strong&gt;她是他的青梅，他是她的竹马。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;那一年，陆家以一只祖传凤钗为聘，将唐婉迎娶过门。&lt;/p&gt;
&lt;p&gt;凤钗映烛光，红烛照新人。婚礼那夜，满堂宾客都说，这分明是天作之合。&lt;/p&gt;
&lt;p&gt;婚后的小日子，甜得像浸了蜜。陆游与唐婉不是寻常夫妻，更是知音。他写诗，她续句；他抚琴，她低唱。两个人常常秉烛夜谈，从诗词歌赋聊到人生哲学，从晨光熹微聊到月落乌啼。&lt;/p&gt;
&lt;p&gt;陆游曾以为，此生最好的光景，不过是眼前人与枕边书。&lt;/p&gt;
&lt;p&gt;可他不知道，这份让世人艳羡的甜蜜，在另一个人眼里，却是刺目的祸水。&lt;/p&gt;
&lt;p&gt;那个人，是他的母亲。&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;贰&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;东风恶&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;母命如山，情薄如纸&lt;/p&gt;
&lt;p&gt;陆母是个传统的大家闺秀，在她看来，男儿当以功名为重，岂能沉溺于儿女情长？&lt;/p&gt;
&lt;p&gt;她看着儿子日日与妻子诗词唱和、耳鬓厮磨，心里的不满像野草一样疯长。更要命的是——&lt;strong&gt;唐婉嫁入陆家数年，膝下无子。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;在那个”不孝有三，无后为大”的年代，这几乎是最致命的罪名。&lt;/p&gt;
&lt;p&gt;陆母多次旁敲侧击，唐婉心中委屈却不敢辩驳。她何尝不想为陆家开枝散叶？只是这世间事，从来不是想就能成的。&lt;/p&gt;
&lt;p&gt;终于有一天，陆母下了最后通牒：&lt;strong&gt;休了她。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;陆游跪在母亲房前，长跪不起。他哀求，他痛哭，他甚至悄悄在外面租了宅院将唐婉藏起来——可纸终究包不住火，陆母发现后勃然大怒，以死相逼。&lt;/p&gt;
&lt;p&gt;一边是生养之恩，一边是挚爱之人。&lt;/p&gt;
&lt;p&gt;陆游选择了母亲。&lt;/p&gt;
&lt;p&gt;他在休书上落笔的那一刻，手是抖的。他不敢看唐婉的眼睛，不敢看她鬓边那支凤钗——那是他给她的承诺，如今却成了最讽刺的笑话。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;唐婉被休了。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;在南宋，被休的女子几乎等同于不祥之人。流言蜚语像刀子一样追着她——“克夫&quot;&quot;无后&quot;&quot;命硬”……每一句都往骨头缝里扎。&lt;/p&gt;
&lt;p&gt;曾经满腹诗书的才女，一夜之间成了人人避之不及的弃妇。她日渐憔悴，像一株被连根拔起的花，在风中摇摇欲坠。&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;叁&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;一诺千金&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;赵士诚的极致深情&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;赵士诚&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;永嘉郡王 · 宋太宗玄孙&lt;/p&gt;
&lt;p&gt;身份显赫，家世煊赫，要什么样的女子没有？可他偏偏看上了唐婉——一个被休的弃妇，一个世人眼中的不祥之人。&lt;/p&gt;
&lt;p&gt;消息传出，整个赵氏宗族炸了锅。&lt;/p&gt;
&lt;p&gt;长辈们轮番劝阻，族中长老拍案而起，连皇族宗亲都出面施压——堂堂郡王，娶一个弃妇，皇家颜面何在？&lt;/p&gt;
&lt;p&gt;可赵士诚铁了心。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“高官厚禄、名声地位，都不及她半分。”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;他不只是嘴上说说。他用一场最隆重的婚礼，给了唐婉这个世间最体面的救赎。十里红妆，八抬大轿，他要让所有人知道——&lt;strong&gt;他娶的不是一个弃妇，是他此生唯一想要守护的人。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;新婚之夜，他对唐婉说：&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“此生只护你一人。”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;在那个三妻四妾再寻常不过的年代，这句话的分量，比任何山盟海誓都重。&lt;/p&gt;
&lt;p&gt;赵士诚说到做到。他待唐婉极好——春天陪她赏花，夏夜陪她纳凉，秋天给她添衣，冬天为她暖汤。他不催她忘掉过去，不逼她笑脸相迎，只是默默地在她身边，像一把伞，替她挡住世间的风雨。&lt;/p&gt;
&lt;p&gt;慢慢地，唐婉脸上又有了笑容。&lt;/p&gt;
&lt;p&gt;她偶尔也会写写诗词，虽然笔下的风月多了几分沧桑，但至少，她重新活了过来。&lt;/p&gt;
&lt;p&gt;赵士诚看着妻子的笑容，觉得这些年所有的压力都值了。&lt;/p&gt;
&lt;p&gt;可命运偏偏要开一场最残忍的玩笑。&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;肆&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;沈园重逢&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;一首杀人的词&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;绍兴二十五年，春。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;赵士诚陪唐婉游沈园，满园春色，柳絮纷飞。唐婉的心情难得地好，甚至主动提议走走当年常走的石径。&lt;/p&gt;
&lt;p&gt;谁也没想到，就在那条小径的尽头，他们撞见了陆游。&lt;/p&gt;
&lt;p&gt;十年未见。&lt;/p&gt;
&lt;p&gt;他老了，她也瘦了。可四目相对的刹那，时光仿佛倒流，回到了当年凤钗定情的那一夜。&lt;/p&gt;
&lt;p&gt;空气凝固了。&lt;/p&gt;
&lt;p&gt;唐婉愣在原地，一时不知该进还是该退。赵士诚看在眼里，心中五味杂陈，可他到底是那个温润如玉的君子——他轻轻点了点头，示意唐婉不必顾忌。&lt;/p&gt;
&lt;p&gt;征得丈夫的同意，唐婉命人给陆游送去一杯黄縢酒，几碟小菜。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;这杯酒，是旧情的最后一丝体面，也是故人的最后一次温柔。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;陆游接过酒，手在抖。他望着唐婉离去的背影，想起当年花前月下的誓言，想起自己亲手签下的休书，想起这十年来每一个辗转难眠的夜晚——&lt;/p&gt;
&lt;p&gt;他崩溃了。&lt;/p&gt;
&lt;p&gt;借着酒劲，陆游踉跄着走到沈园的粉壁前，提笔写下了那首流传千古的词——&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;伍&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;钗头凤 · 陆游&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;错错错，一错再错&lt;/p&gt;
&lt;p&gt;📜        &lt;strong&gt;钗头凤 · 红酥手&lt;/strong&gt;        陆游&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;红酥手，黄縢酒，满城春色宫墙柳。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;东风恶，欢情薄，一怀愁绪，几年离索。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;错！错！错！&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;春如旧，人空瘦，泪痕红浥鲛绡透。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;桃花落，闲池阁，山盟虽在，锦书难托。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;莫！莫！莫！&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;起笔：美得心碎&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“红酥手，黄縢酒，满城春色宫墙柳。”&lt;/p&gt;
&lt;p&gt;你红润酥腻的手捧着黄縢酒，满城春花开，宫墙旁的柳枝随风摇曳——一如当年我们共度的时光。&lt;/p&gt;
&lt;p&gt;可如今，这眼前景，全是我当年亲手推开的。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;物是人非的对比，比刀割还疼。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;转折：恨入骨髓&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“东风恶，欢情薄，一怀愁绪，几年离索。”&lt;/p&gt;
&lt;p&gt;东风太恶毒了，把我们的欢情吹得那么稀薄。这几年，我满怀愁绪，我们各自飘零——明明相爱，却只能相望。&lt;/p&gt;
&lt;p&gt;这里的”东风”不是春风，是陆母的苛责，是封建礼教的条条框框，是那座压得他喘不过气来的伦理之山。&lt;/p&gt;
&lt;p&gt;这是陆游的自责，也是他的无奈。他恨自己护不住爱人，恨世俗拆散了彼此，他什么也做不了，只能任由愁绪填满心底。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;爆发：三个”错”字&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“错！错！错！”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;错在不敢违逆母亲，错在当初放手，错在十年未忘，再见仍乱了心神。&lt;/p&gt;
&lt;p&gt;三个”错”字，没有任何修饰，却比千言万语更有力量。就像一个人被逼到绝境，只能用最简单的字宣泄最极致的痛苦。&lt;/p&gt;
&lt;p&gt;陆游在这里扇的是自己的耳光。他知道一切都晚了，所有的错误都无法挽回。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;凝望：你瘦了&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“春如旧，人空瘦，泪痕红浥鲛绡透。”&lt;/p&gt;
&lt;p&gt;春天还像以前一样，可你怎么瘦成了这样？你的手帕都被带着胭脂的眼泪湿透了。&lt;/p&gt;
&lt;p&gt;他心疼了。可他不知道——&lt;strong&gt;唐婉肩上披着的，是赵士诚送的暖裘；绣囊里藏着的，是赵士诚写的平安信。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;他以为她过得不好，却不知道，是另一个人替他完成了他没能做到的事。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;绝笔：三个”莫”字&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“山盟虽在，锦书难托。”&lt;/p&gt;
&lt;p&gt;我们当年的海誓山盟还在，可现在就算写了信，也没法寄给你了——你已经是赵家人了，而我只是个路人甲。&lt;/p&gt;
&lt;p&gt;他的任何念想，都是对唐婉现有幸福的冒犯。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“莫！莫！莫！”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;罢了罢了。莫再想，莫再念，莫再扰。&lt;/p&gt;
&lt;p&gt;这三个”莫”字，是绝望，是放手，是明知不可为而为之后的彻底放弃。&lt;/p&gt;
&lt;p&gt;陆游写完，哭着走了。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;他不知道，这首词，成了一把插进唐婉心里的刀。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;陆&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;钗头凤 · 唐婉&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;难难难，无路可退&lt;/p&gt;
&lt;p&gt;第二年春天，唐婉重游沈园。&lt;/p&gt;
&lt;p&gt;她看到了墙上那首词——墨迹斑斑，全是前夫的血泪。&lt;/p&gt;
&lt;p&gt;那一刻，她心里筑了十年的防线，轰然崩塌。&lt;/p&gt;
&lt;p&gt;于是她提笔，在陆游的词旁，写下了自己的回答——&lt;/p&gt;
&lt;p&gt;📜        &lt;strong&gt;钗头凤 · 世情薄&lt;/strong&gt;        唐婉&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;世情薄，人情恶，雨送黄昏花易落。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;晓风干，泪痕残，欲笺心事，独语斜阑。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;难！难！难！&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;人成各，今非昨，病魂常似秋千索。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;角声寒，夜阑珊，怕人寻问，咽泪装欢。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;瞒！瞒！瞒！&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;写完这首词不久，唐婉抑郁而终，香消玉殒。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;世情薄：人心比夜更凉&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“世情薄，人情恶，雨送黄昏花易落。”&lt;/p&gt;
&lt;p&gt;如果说陆游的词是悔，那唐婉的词就是疼。&lt;/p&gt;
&lt;p&gt;陆游骂东风，唐婉叹世情。这个世道太凉薄，人心太险恶，我就像那黄昏雨中的花——哪怕再美，也注定要凋落。&lt;/p&gt;
&lt;p&gt;这是她的亲身感受。被休之后，她成了别人口中的弃妇，流言蜚语、冷眼相待，唯有赵士诚将她护在伞下。&lt;/p&gt;
&lt;p&gt;可陆游的词一出来，那把伞就破了。风雨全往旧伤口里钻。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;独语斜阑：连倾诉的资格都没有&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“晓风干，泪痕残，欲笺心事，独语斜阑。”&lt;/p&gt;
&lt;p&gt;早晨的风吹干了泪痕，我想把心事写下来——可写给谁？&lt;/p&gt;
&lt;p&gt;写给陆游，是对赵士诚的辜负；写给赵士诚，是让他十年的温柔都成了笑话；写给自己，又怕眼泪晕开了墨迹。&lt;/p&gt;
&lt;p&gt;只能独自靠在栏杆上，对着空庭自言自语。&lt;/p&gt;
&lt;p&gt;**这份孤独，比分离更让人绝望。**陆游至少还能把愁绪写在墙上，可唐婉连倾诉的资格都没有，只能把心事一层一层地压在心底。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;三个”难”字：无路可走&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“难！难！难！”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;陆游说”错”，是悔恨；唐婉说”难”，是无路可走。&lt;/p&gt;
&lt;p&gt;相见难，倾诉难，放下难——旧爱新欢缠成死结。&lt;/p&gt;
&lt;p&gt;她不像陆游，还能有一丝悔恨的余地。她的处境只有无尽的艰难，没有任何出路，这份痛苦永远也解脱不了。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;病魂秋千：身体与精神的双重崩塌&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“人成各，今非昨，病魂常似秋千索。”&lt;/p&gt;
&lt;p&gt;如今我们各自安好，再也不是当年的模样。&lt;strong&gt;病魂常似秋千索&lt;/strong&gt;——这是最让人心疼的一句。&lt;/p&gt;
&lt;p&gt;唐婉因为长期的悲伤，身体早已垮了。被休时病过一次，被陆游的词又勾病了。就像秋千上的绳索，晃晃悠悠，找不到安稳。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;咽泪装欢：最扎心的一幕&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;“角声寒，夜阑珊，怕人寻问，咽泪装欢。”&lt;/p&gt;
&lt;p&gt;深夜，角声传来，寒意刺骨，她独自落泪。赵士诚给她暖汤盖被，她却不敢说——不是天冷，&lt;strong&gt;是心冷。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;陆游可以发泄，可以写词骂东风；可唐婉不行。她夹在中间，不能负了旧情，又不敢伤了新人，所以连痛苦都要藏着掖着。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“她的装欢，比痛哭更让人心疼。”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;就像我们受了委屈，却要在家人面前强颜欢笑&lt;/p&gt;
&lt;p&gt;就像我们心里难过，却要在朋友面前假装没事&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;三个”瞒”字：耗尽了一生&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;“瞒！瞒！瞒！”&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;瞒住对陆游的念想，瞒住心里的伤痛，瞒住所有人——假装幸福。&lt;/p&gt;
&lt;p&gt;可惜她瞒过了所有人，却瞒不过自己的身体。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;三个”瞒”字，耗尽了她的生命。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;柒&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;赵士诚&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;被历史遗忘的深情&lt;/p&gt;
&lt;p&gt;唐婉死后，赵士诚的世界也塌了。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;他终身没有再娶，没有纳妾。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;在那个三妻四妾再寻常不过的年代，这几乎是个奇迹。堂堂郡王，皇族之后，却为一个人守了一辈子的寡。&lt;/p&gt;
&lt;p&gt;后来，赵士诚主动请缨，奔赴沙场。&lt;/p&gt;
&lt;p&gt;他不是好战，他是找不到活着的理由了。战场上刀剑无眼，他不在乎。他要用最决绝的方式，去陪他的爱人——&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;生不同衾，死同穴。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;那天在沈园，是他大度地让妻子给前夫送酒。他以为这能解开妻子的心结，以为自己的十年温柔终能抚平她的伤疤。&lt;/p&gt;
&lt;p&gt;可他万万没想到，陆游的一首词，摧毁了他十年的全部努力。&lt;/p&gt;
&lt;p&gt;他的温柔，他的守护，他的不离不弃——在陆游那面墙的墨迹面前，轻得像一缕风。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;可这缕风，暖了唐婉整整十年。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;捌&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;陆游的余生&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;一辈子没走出沈园&lt;/p&gt;
&lt;p&gt;反观陆游，虽然活到了八十五岁，但他这辈子都没走出那个沈园。&lt;/p&gt;
&lt;p&gt;他晚年写了无数首诗怀念唐婉——&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;城上斜阳画角哀，沈园非复旧池台。&lt;/strong&gt;&lt;br /&gt;
&lt;strong&gt;伤心桥下春波绿，曾是惊鸿照影来。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;陆游《沈园二首 · 其一》&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;梦断香消四十年，沈园柳老不吹绵。&lt;/strong&gt;&lt;br /&gt;
&lt;strong&gt;此身行作稽山土，犹吊遗踪一泫然。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;陆游《沈园二首 · 其二》&lt;/p&gt;
&lt;p&gt;临死前一年，八十四岁的陆游还挣扎着去了一趟沈园。&lt;/p&gt;
&lt;p&gt;他站在那面墙前，墙上的字迹早已斑驳，可他的眼泪还是止不住地流。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;那是他对唐婉最后的告白。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;五十年了，他还是没有放下。&lt;/p&gt;
&lt;p&gt;今浙江绍兴沈园&lt;/p&gt;
&lt;p&gt;◆◆◆&lt;/p&gt;
&lt;section&gt;&lt;h2&gt;&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;尾声 · 爱情最狠的真相&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;有人说，唐婉是虚构的，钗头凤是后人附会的，赵士诚的深情也是假的。&lt;/p&gt;&lt;p&gt;但真假已经不重要了。&lt;/p&gt;&lt;p&gt;因为这个故事记录的那种痛，是真实的。&lt;br /&gt;
它代表了千百年来那些被封建礼教拆散的、爱而不得的灵魂。&lt;/p&gt;&lt;p&gt;我们总为陆游的”错”叹息，为唐婉的”苦”流泪，&lt;br /&gt;
却忘了问一句——&lt;/p&gt;&lt;p&gt;&lt;strong&gt;赵士诚的十年温柔，到底算什么？&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;两首钗头凤，一首是男人的懦弱与悔恨，&lt;br /&gt;
一首是女人的隐忍与绝望。&lt;/p&gt;&lt;p&gt;字里行间全是对旧爱的执念，&lt;br /&gt;
却唯独欠了赵士诚一句——&lt;/p&gt;&lt;p&gt;&lt;strong&gt;谢谢你。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;这才是爱情最狠的真相：&lt;br /&gt;
有些人，一旦错过，就是一辈子。&lt;br /&gt;
有些爱，一旦回头，就是万丈深渊。&lt;/p&gt;&lt;p&gt;如果你身边有一个赵士诚这样的人，&lt;br /&gt;
请千万千万要珍惜。&lt;br /&gt;
别为了那个已经错过的陆游，伤了眼前人的心。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;满目山河空念远&lt;/strong&gt;&lt;br /&gt;
&lt;strong&gt;不如怜取眼前人&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;但愿这世间&lt;br /&gt;
少一些”错错错”的遗憾&lt;br /&gt;
少一些”瞒瞒瞒”的悲凉&lt;/p&gt;&lt;p&gt;&lt;strong&gt;若爱，请深爱。&lt;/strong&gt;&lt;br /&gt;
&lt;strong&gt;莫待锦书难托，人空瘦。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;💬 评论区&lt;/p&gt;&lt;p&gt;读完陆游与唐婉的故事，你更心疼谁？&lt;br /&gt;
是爱而不得的陆游，隐忍成疾的唐婉，还是深情不被看见的赵士诚？&lt;br /&gt;
欢迎在评论区分享你的感受 ✍️&lt;/p&gt;&lt;section&gt;&lt;h3&gt;&lt;a href=&quot;#-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;strong&gt;— 附录 · 钗头凤二首 —&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;《钗头凤 · 红酥手》— 陆游&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;红酥手，黄縢酒，满城春色宫墙柳。&lt;/p&gt;&lt;p&gt;东风恶，欢情薄，一怀愁绪，几年离索。&lt;/p&gt;&lt;p&gt;错！错！错！&lt;/p&gt;&lt;p&gt;春如旧，人空瘦，泪痕红浥鲛绡透。&lt;/p&gt;&lt;p&gt;桃花落，闲池阁，山盟虽在，锦书难托。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>封狼居胥霍去病——那个用一生燃烧大汉荣耀的少年</title><link>https://firefly.cuteleaf.cn/posts/%E9%9C%8D%E5%8E%BB%E7%97%85/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/%E9%9C%8D%E5%8E%BB%E7%97%85/</guid><pubDate>Mon, 04 May 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;封狼居胥——那个用一生燃烧大汉荣耀的少年&lt;/p&gt;
&lt;p&gt;漢&lt;/p&gt;
&lt;p&gt;大汉战神 · 霍去病&lt;/p&gt;
&lt;section&gt;&lt;h1&gt;&lt;/h1&gt;&lt;p&gt;封狼居胥&lt;/p&gt;&lt;p&gt;那个用一生燃烧大汉荣耀的少年&lt;/p&gt;&lt;p&gt;23&lt;/p&gt;&lt;p&gt;岁辞世&lt;/p&gt;&lt;p&gt;6&lt;/p&gt;&lt;p&gt;次出征&lt;/p&gt;&lt;p&gt;11万+&lt;/p&gt;&lt;p&gt;斩首俘获&lt;/p&gt;&lt;p&gt;公元前119年，狼居胥山上站着一个21岁的青年。他在匈奴人的神山之上，祭拜了汉人的天地。这是华夏历史上，唯一一个非帝王身份的男人完成的封禅，也是第一个在敌人领土上进行的封禅。&lt;/p&gt;&lt;p&gt;他叫霍去病。&lt;/p&gt;&lt;p&gt;壹&lt;/p&gt;&lt;section&gt;&lt;h3&gt;七十年的屈辱，一朝清算&lt;a href=&quot;#七十年的屈辱一朝清算&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;公元前200年，刘邦一时头脑发热，亲率几千人追着几万匈奴猛砍，结果被匈奴单于冒顿来了个”回首掏”，被困白登山七天七夜。这场白登之围，让大汉丢尽了脸面，此后七十余年，汉朝只能靠送公主、送财物换来表面的和平。&lt;/p&gt;&lt;p&gt;然而匈奴依然年年南下劫掠，杀人放火，如入无人之境。这种屈辱，一直压到一个叫刘彻的皇帝登基。&lt;/p&gt;&lt;p&gt;汉武帝刘彻恨透了靠女人和亲换来的和平。&lt;/p&gt;&lt;p&gt;他要彻底扭转——汉守匈攻的局面。&lt;/p&gt;&lt;p&gt;于是，这位野心极大的皇帝在走访姐姐平阳公主府时，随手就从一个舞女身上，给大汉抽到了三张SSR——卫青、霍去病、霍光。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;贰&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;私生子出道，天子亲自调教&lt;a href=&quot;#私生子出道天子亲自调教&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;公元前140年，平阳侯府的女奴魏少儿为一个小吏生下了一个私生子，那个渣男叫霍仲儒，提上裤子就跑，从此断了联系。&lt;/p&gt;&lt;p&gt;但霍仲儒可能做梦也没想到，魏少儿的妹妹卫子夫后来上了刘彻的龙床，老魏家瞬间草鸡变凤凰，成了皇家外戚。而这个叫霍去病的私生子，因为极强的骑射天赋被刘彻看中，提拔为近臣侍中——天子亲信。&lt;/p&gt;&lt;p&gt;刘彻太喜欢这个孩子了，准备亲自传授他孙吴兵法。然而霍去病直接婉拒了：&lt;/p&gt;&lt;p&gt;”&lt;/p&gt;&lt;p&gt;顾方略何如耳，不至学古兵法。&lt;/p&gt;&lt;p&gt;打仗只需要看准方针策略，不需要学古人那些用不着的东西。&lt;/p&gt;&lt;p&gt;—— 霍去病，拒绝天子教授兵法&lt;/p&gt;&lt;p&gt;刘彻没有生气，反而更爱了。因为这个孩子身上有一种让他着迷的东西——纯粹的、不可遏制的战场直觉。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;叁&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;出道即巅峰：八百骑，斩首两千&lt;a href=&quot;#出道即巅峰八百骑斩首两千&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;公元前123年，17岁的霍去病第一次跟着舅舅卫青出征。卫青给了外甥八百精锐壮士，然后霍去病带着这八百人，脱离大部队，直插大漠深处。&lt;/p&gt;&lt;p&gt;⚔ 首战战报 · 公元前123年&lt;/p&gt;&lt;p&gt;800&lt;/p&gt;&lt;p&gt;出征骑兵&lt;/p&gt;&lt;p&gt;2028&lt;/p&gt;&lt;p&gt;斩首+俘虏&lt;/p&gt;&lt;p&gt;俘获匈奴相国、当户等高级官员，斩杀匈奴大单于的祖父若侯铲，俘虏单于的叔父罗姑比。&lt;/p&gt;&lt;p&gt;与此同时，汉军主力右将军苏建、前将军赵信率三千骑兵与匈奴激战，全军覆没，赵信更是直接投降了匈奴。&lt;/p&gt;&lt;p&gt;**有对比，才知道天才和普通人的差距。**八百 vs 两千，出道即巅峰的霍去病，成了汉武帝刘彻心中那个”亲临战场的化身”。&lt;/p&gt;&lt;p&gt;刘彻封霍去病为冠军侯&lt;/p&gt;&lt;p&gt;赐豪华宅邸，让他去住。霍去病说——&lt;/p&gt;&lt;p&gt;“匈奴未灭，无以家为。”&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;肆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;两打河西，打通丝绸之路&lt;a href=&quot;#两打河西打通丝绸之路&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;公元前121年，刘彻将目光投向河西走廊——中原通往西域的咽喉要道，当时被匈奴浑邪王和休屠王控制，与羌人联合，从西边威胁大汉。刘彻想要剁掉匈奴的这条右臂，为最终的漠北决战扫清后路。&lt;/p&gt;&lt;p&gt;这年春天，19岁的霍去病率一万骑兵出征。他越乌鞘岭，渡黄河，六天转战千余里，踏破匈奴五王国。匈奴单于的儿子不服，想和霍去病过两招，被瞬间打崩，险些被活捉。&lt;/p&gt;&lt;p&gt;📜 河西两战战绩对比&lt;/p&gt;&lt;p&gt;春季第一战&lt;/p&gt;&lt;p&gt;夏季第二战&lt;/p&gt;&lt;p&gt;兵力&lt;/p&gt;&lt;p&gt;10,000骑&lt;/p&gt;&lt;p&gt;孤军深入&lt;/p&gt;&lt;p&gt;斩获&lt;/p&gt;&lt;p&gt;8,960级&lt;/p&gt;&lt;p&gt;歼敌3万+&lt;/p&gt;&lt;p&gt;战果&lt;/p&gt;&lt;p&gt;斩折兰王、卢侯王，俘浑邪王子&lt;/p&gt;&lt;p&gt;俘获单于阏氏、王子等59人&lt;/p&gt;&lt;p&gt;特殊战利品&lt;/p&gt;&lt;p&gt;抢走匈奴祭天金人&lt;/p&gt;&lt;p&gt;封侯部将3人&lt;/p&gt;&lt;p&gt;第二次河西之战，霍去病发现队友全是拖后腿的——公孙敖走岔了路，李广又一次被包围差点全军覆没，张骞迷路来晚了。四路人马只剩霍去病孤军深入2000余里，绕到敌军侧后突然猛攻。&lt;/p&gt;&lt;p&gt;骄傲的骠骑将军眼里只有陛下和舅舅，至于一些累赘，&lt;strong&gt;跟不上就别跟。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;🔍 霍去病能深入大漠2000里还能找到敌人的秘密&lt;/p&gt;&lt;p&gt;他敢于、善于用匈奴人当手下——&lt;/p&gt;&lt;p&gt;◈&lt;/p&gt;&lt;p&gt;校尉高不识 — 匈奴小王出身，本家人带路&lt;/p&gt;&lt;p&gt;◈&lt;/p&gt;&lt;p&gt;司马赵破奴 — 长期生活在匈奴的汉人，熟悉地形&lt;/p&gt;&lt;p&gt;◈&lt;/p&gt;&lt;p&gt;部署几乎全是匈奴人 — 以战养战，轻装奔袭&lt;/p&gt;&lt;p&gt;匈奴之歌（哀歌）&lt;/p&gt;&lt;p&gt;失我祁连山，使我六畜不蕃息；&lt;/p&gt;&lt;p&gt;失我焉支山，令我妇女无颜色。&lt;/p&gt;&lt;p&gt;对匈奴，这是耻辱的哀歌；对大汉，这是踏血的荣耀。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;伍&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;漠北大决战：封狼居胥，饮马瀚海&lt;a href=&quot;#漠北大决战封狼居胥饮马瀚海&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;公元前119年，汉武帝刘彻发动了对匈奴最大规模的决战。卫青、霍去病各率五万骑兵，分两路深入漠北，力求一战定乾坤。&lt;/p&gt;&lt;p&gt;原定由霍去病直取匈奴大单于，但俘虏透露大单于已向东移动，于是舅舅与外甥换了位置。卫青西出，遭遇大单于；霍去病东出代郡，迎战左贤王。&lt;/p&gt;&lt;p&gt;卫青路线&lt;/p&gt;&lt;p&gt;出定襄，遇大单于主力&lt;/p&gt;&lt;p&gt;趁沙尘暴双翼包抄&lt;/p&gt;&lt;p&gt;歼敌 19,000 人&lt;/p&gt;&lt;p&gt;大单于西北突围逃遁&lt;/p&gt;&lt;p&gt;霍去病路线&lt;/p&gt;&lt;p&gt;出代郡，北进 2000+ 里&lt;/p&gt;&lt;p&gt;大破左贤王，歼敌 70,000&lt;/p&gt;&lt;p&gt;俘获王侯将相 80+ 人&lt;/p&gt;&lt;p&gt;追至狼居胥山，封禅&lt;/p&gt;&lt;p&gt;⚑ 公元前119年 · 狼居胥山顶 ⚑&lt;/p&gt;&lt;p&gt;这个21岁的青年，站在匈奴人的神山之上，筑坛祭拜大汉的天。&lt;/p&gt;&lt;p&gt;随后，又马不停蹄赶到姑衍山，筑坛祭拜大汉的地。&lt;/p&gt;&lt;p&gt;在那个封建迷信的年代，这是在&lt;strong&gt;杀人诛心&lt;/strong&gt;——他要斩断匈奴的龙脉，断绝匈奴的国运。&lt;/p&gt;&lt;p&gt;完成封禅后，霍去病率军一路向北，直抵今天的贝加尔湖畔。&lt;/p&gt;&lt;p&gt;饮马瀚海，遥望长安。&lt;/p&gt;&lt;p&gt;漠北大决战后，匈奴势力被严重削弱，大单于逃至漠北，&lt;strong&gt;匈奴远遁漠南，再无王庭。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;陆&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;流星划过，年仅二十三岁&lt;a href=&quot;#流星划过年仅二十三岁&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;公元前117年，就在汉武帝准备再次出击匈奴时，才发现他的这张最强战牌，到期了。&lt;/p&gt;&lt;p&gt;或许是多次领兵千里奔袭后的积劳成疾，或许是感染了大漠中的瘟疫，年仅23岁的霍去病突然病逝。&lt;/p&gt;&lt;p&gt;痛苦万分的武帝刘彻，下令让霍去病陪葬茂陵，赐谥号”景桓”，调遣河西五郡的铁甲军列阵为他送葬，并将坟墓修成祁连山的形状，以彰显他克敌制胜的奇功。&lt;/p&gt;&lt;p&gt;坟墓形如祁连山 · 铁甲军送葬&lt;/p&gt;&lt;p&gt;千年已过，那个在河西、在祁连山、在狼居胥、&lt;br /&gt;
在瀚海纵马狂奔的少年，&lt;/p&gt;&lt;p&gt;已经成为了一颗耀眼的流星，&lt;br /&gt;
永远铭刻在汉家儿郎的脑海里。&lt;/p&gt;&lt;p&gt;✦&lt;/p&gt;&lt;p&gt;终&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;开疆拓土，是刻在基因里的荣耀&lt;a href=&quot;#开疆拓土是刻在基因里的荣耀&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;霍去病留给这个民族的，不只是那一场场战役的胜利，而是一种精神——无论什么时代，为民族、为国家收复失地、开疆拓土，永远是华夏儿郎最高的功勋。&lt;/p&gt;&lt;p&gt;流传千古的名言&lt;/p&gt;&lt;p&gt;匈奴未灭，无以家为。&lt;/p&gt;&lt;p&gt;这五个字，是一个少年的志向，也是一个时代的回响。&lt;/p&gt;&lt;p&gt;这一颗流星虽然短暂，&lt;br /&gt;
却给了后人喊出那句话的底气——&lt;/p&gt;&lt;p&gt;犯强汉者，虽远必诛。&lt;/p&gt;&lt;p&gt;汉武、长平、冠军，他们让开疆拓土，&lt;br /&gt;
成为每一个汉人铭刻在基因里的荣耀使命。&lt;/p&gt;&lt;p&gt;大 汉 荣 耀&lt;/p&gt;&lt;p&gt;中国历史文化人物&lt;/p&gt;&lt;p&gt;在历史中寻找力量，在人物中看见自己&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>blog布局系统详解</title><link>https://firefly.cuteleaf.cn/posts/blog%E5%B8%83%E5%B1%80%E7%B3%BB%E7%BB%9F%E8%AF%A6%E8%A7%A3/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/blog%E5%B8%83%E5%B1%80%E7%B3%BB%E7%BB%9F%E8%AF%A6%E8%A7%A3/</guid><description>深入了解 Firefly 的布局系统，包括侧边栏布局（左侧/双侧）和文章列表布局（列表/网格），以及自适应网格列数。</description><pubDate>Sat, 03 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;📖 概述&lt;a href=&quot;#-概述&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 提供了灵活的布局系统，允许您根据内容需求和个人喜好自定义博客的视觉呈现方式。布局系统主要包括&lt;strong&gt;侧边栏布局&lt;/strong&gt;和&lt;strong&gt;文章列表布局&lt;/strong&gt;两个维度，它们相互配合，共同决定了页面的整体结构。&lt;/p&gt;&lt;p&gt;本文将详细介绍 Firefly 的各种布局模式、它们的特点、使用场景，以及不同布局组合的效果。&lt;/p&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;img alt=&quot;左侧边栏+列表布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-list.CdJfuugk_23fiFf.webp&quot; srcset=&quot;/_astro/left-list.CdJfuugk_Z1mA0Ez.webp 640w, /_astro/left-list.CdJfuugk_Z10qgrr.webp 750w, /_astro/left-list.CdJfuugk_Z2cj349.webp 828w, /_astro/left-list.CdJfuugk_u3eLs.webp 1080w, /_astro/left-list.CdJfuugk_2fAX5y.webp 1280w, /_astro/left-list.CdJfuugk_2oEKUW.webp 1668w, /_astro/left-list.CdJfuugk_Z1KIWFC.webp 2048w, /_astro/left-list.CdJfuugk_23fiFf.webp 2192w&quot; /&gt;&lt;figcaption&gt;左侧边栏+列表布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;右侧边栏+网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp&quot; srcset=&quot;/_astro/right-grid2.BDLeNFG9_26ckzG.webp 640w, /_astro/right-grid2.BDLeNFG9_1tKDP4.webp 750w, /_astro/right-grid2.BDLeNFG9_Z1CTouC.webp 828w, /_astro/right-grid2.BDLeNFG9_27C8ym.webp 1080w, /_astro/right-grid2.BDLeNFG9_ZDs3VJ.webp 1280w, /_astro/right-grid2.BDLeNFG9_Z20DfDW.webp 1668w, /_astro/right-grid2.BDLeNFG9_ZiVVYz.webp 2048w, /_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp 2192w&quot; /&gt;&lt;figcaption&gt;右侧边栏+网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;左侧边栏+三列网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp&quot; srcset=&quot;/_astro/left-grid3.DCIbm9j3_aED3D.webp 640w, /_astro/left-grid3.DCIbm9j3_ZKzKs3.webp 750w, /_astro/left-grid3.DCIbm9j3_ZqcTCb.webp 828w, /_astro/left-grid3.DCIbm9j3_gjdwz.webp 1080w, /_astro/left-grid3.DCIbm9j3_22TUla.webp 1280w, /_astro/left-grid3.DCIbm9j3_ZHnOlo.webp 1668w, /_astro/left-grid3.DCIbm9j3_ZIg0jq.webp 2048w, /_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp 2192w&quot; /&gt;&lt;figcaption&gt;左侧边栏+三列网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;/div&gt;&lt;div&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+列表布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-list.CybtDZTU_xxVkb.webp&quot; srcset=&quot;/_astro/both-list.CybtDZTU_Z1JydKr.webp 640w, /_astro/both-list.CybtDZTU_Z1notxj.webp 750w, /_astro/both-list.CybtDZTU_2uTRDU.webp 828w, /_astro/both-list.CybtDZTU_Z10D7yB.webp 1080w, /_astro/both-list.CybtDZTU_JTAJu.webp 1280w, /_astro/both-list.CybtDZTU_SXozS.webp 1668w, /_astro/both-list.CybtDZTU_1NKNMf.webp 2048w, /_astro/both-list.CybtDZTU_xxVkb.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+列表布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-grid.B-BFe9Al_1g1tLj.webp&quot; srcset=&quot;/_astro/both-grid.B-BFe9Al_SVz9I.webp 640w, /_astro/both-grid.B-BFe9Al_1g6jmQ.webp 750w, /_astro/both-grid.B-BFe9Al_4dwK9.webp 828w, /_astro/both-grid.B-BFe9Al_Ziaz7t.webp 1080w, /_astro/both-grid.B-BFe9Al_1sn9bC.webp 1280w, /_astro/both-grid.B-BFe9Al_1BqW21.webp 1668w, /_astro/both-grid.B-BFe9Al_2wemen.webp 2048w, /_astro/both-grid.B-BFe9Al_1g1tLj.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+网格瀑布流布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/masonry.BgzRsBcp_2mfpqn.webp&quot; srcset=&quot;/_astro/masonry.BgzRsBcp_Q6h0.webp 640w, /_astro/masonry.BgzRsBcp_Z1iSuyb.webp 750w, /_astro/masonry.BgzRsBcp_2mj2SJ.webp 828w, /_astro/masonry.BgzRsBcp_19DifP.webp 1080w, /_astro/masonry.BgzRsBcp_ZGipcR.webp 1280w, /_astro/masonry.BgzRsBcp_1XuHi6.webp 1668w, /_astro/masonry.BgzRsBcp_ZwgGla.webp 2048w, /_astro/masonry.BgzRsBcp_2mfpqn.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+网格瀑布流布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;一、侧边栏布局系统&lt;a href=&quot;#一侧边栏布局系统&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;侧边栏是博客页面的重要组成部分，用于展示导航、分类、标签、统计信息等辅助内容。Firefly 支持两种侧边栏布局模式。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;1.1 单侧边栏模式&lt;a href=&quot;#11-单侧边栏模式&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;左侧边栏 (position: “left”)&lt;a href=&quot;#左侧边栏-position-left&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;左侧边栏布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-list.CdJfuugk_23fiFf.webp&quot; srcset=&quot;/_astro/left-list.CdJfuugk_Z1mA0Ez.webp 640w, /_astro/left-list.CdJfuugk_Z10qgrr.webp 750w, /_astro/left-list.CdJfuugk_Z2cj349.webp 828w, /_astro/left-list.CdJfuugk_u3eLs.webp 1080w, /_astro/left-list.CdJfuugk_2fAX5y.webp 1280w, /_astro/left-list.CdJfuugk_2oEKUW.webp 1668w, /_astro/left-list.CdJfuugk_Z1KIWFC.webp 2048w, /_astro/left-list.CdJfuugk_23fiFf.webp 2192w&quot; /&gt;&lt;figcaption&gt;左侧边栏布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;右侧边栏 (position: “right”)&lt;a href=&quot;#右侧边栏-position-right&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;右侧边栏布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp&quot; srcset=&quot;/_astro/right-grid2.BDLeNFG9_26ckzG.webp 640w, /_astro/right-grid2.BDLeNFG9_1tKDP4.webp 750w, /_astro/right-grid2.BDLeNFG9_Z1CTouC.webp 828w, /_astro/right-grid2.BDLeNFG9_27C8ym.webp 1080w, /_astro/right-grid2.BDLeNFG9_ZDs3VJ.webp 1280w, /_astro/right-grid2.BDLeNFG9_Z20DfDW.webp 1668w, /_astro/right-grid2.BDLeNFG9_ZiVVYz.webp 2048w, /_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp 2192w&quot; /&gt;&lt;figcaption&gt;右侧边栏布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;侧边栏固定在页面其中一侧&lt;/li&gt;
&lt;li&gt;文章阅读区域体验更佳，更宽敞&lt;/li&gt;
&lt;li&gt;更加简约，没有那么紧凑&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;适用场景&lt;a href=&quot;#适用场景&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;传统博客风格&lt;/li&gt;
&lt;li&gt;强调导航和分类的博客&lt;/li&gt;
&lt;li&gt;需要突出用户资料的个人博客&lt;/li&gt;
&lt;li&gt;内容为主，辅助信息次之的场景&lt;/li&gt;
&lt;/ul&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;Tip&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;p&gt;可以通过showBothSidebarsOnPostPage配置是否在文章详情页显示双侧边栏&lt;/p&gt;&lt;p&gt;当position为left或right时开启此项后，文章详情页将显示双侧边栏，主页等其他页面保持单侧边栏&lt;/p&gt;&lt;p&gt;适用在只想用单侧栏，但在文章详情页想用对侧栏的目录等组件的场景&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/sidebarConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;sidebarLayoutConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SidebarLayoutConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;enable&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;position&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;left&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 左侧边栏&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;showBothSidebarsOnPostPage&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 是否在文章详情页显示双侧边栏&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;1.2 双侧边栏模式 (position: “both”)&lt;a href=&quot;#12-双侧边栏模式-position-both&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;左右两侧同时存在侧边栏&lt;/li&gt;
&lt;li&gt;主内容区域位于中间&lt;/li&gt;
&lt;li&gt;最大化利用屏幕空间&lt;/li&gt;
&lt;li&gt;可以展示更多辅助信息&lt;/li&gt;
&lt;li&gt;适合宽屏显示器&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;布局结构&lt;a href=&quot;#布局结构&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+列表布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-list.CybtDZTU_xxVkb.webp&quot; srcset=&quot;/_astro/both-list.CybtDZTU_Z1JydKr.webp 640w, /_astro/both-list.CybtDZTU_Z1notxj.webp 750w, /_astro/both-list.CybtDZTU_2uTRDU.webp 828w, /_astro/both-list.CybtDZTU_Z10D7yB.webp 1080w, /_astro/both-list.CybtDZTU_JTAJu.webp 1280w, /_astro/both-list.CybtDZTU_SXozS.webp 1668w, /_astro/both-list.CybtDZTU_1NKNMf.webp 2048w, /_astro/both-list.CybtDZTU_xxVkb.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+列表布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-grid.B-BFe9Al_1g1tLj.webp&quot; srcset=&quot;/_astro/both-grid.B-BFe9Al_SVz9I.webp 640w, /_astro/both-grid.B-BFe9Al_1g6jmQ.webp 750w, /_astro/both-grid.B-BFe9Al_4dwK9.webp 828w, /_astro/both-grid.B-BFe9Al_Ziaz7t.webp 1080w, /_astro/both-grid.B-BFe9Al_1sn9bC.webp 1280w, /_astro/both-grid.B-BFe9Al_1BqW21.webp 1668w, /_astro/both-grid.B-BFe9Al_2wemen.webp 2048w, /_astro/both-grid.B-BFe9Al_1g1tLj.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;适用场景&lt;a href=&quot;#适用场景-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;宽屏桌面端浏览&lt;/li&gt;
&lt;li&gt;信息密集型博客&lt;/li&gt;
&lt;li&gt;需要展示大量辅助内容&lt;/li&gt;
&lt;li&gt;专业性强的技术博客&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/sidebarConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;sidebarLayoutConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SidebarLayoutConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;enable&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;position&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;both&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 双侧边栏&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;二、文章列表布局系统&lt;a href=&quot;#二文章列表布局系统&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;文章列表是博客首页和归档页的核心内容，Firefly 提供两种展示方式，并支持多种网格配置。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;2.1 列表模式 (defaultMode: “list”)&lt;a href=&quot;#21-列表模式-defaultmode-list&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;单列纵向排列&lt;/li&gt;
&lt;li&gt;显示文章封面图&lt;/li&gt;
&lt;li&gt;展示更多文章摘要&lt;/li&gt;
&lt;li&gt;适合深度阅读&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;列表布局结构&lt;a href=&quot;#列表布局结构&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;列表模式布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-list.CdJfuugk_23fiFf.webp&quot; srcset=&quot;/_astro/left-list.CdJfuugk_Z1mA0Ez.webp 640w, /_astro/left-list.CdJfuugk_Z10qgrr.webp 750w, /_astro/left-list.CdJfuugk_Z2cj349.webp 828w, /_astro/left-list.CdJfuugk_u3eLs.webp 1080w, /_astro/left-list.CdJfuugk_2fAX5y.webp 1280w, /_astro/left-list.CdJfuugk_2oEKUW.webp 1668w, /_astro/left-list.CdJfuugk_Z1KIWFC.webp 2048w, /_astro/left-list.CdJfuugk_23fiFf.webp 2192w&quot; /&gt;&lt;figcaption&gt;列表模式布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;优点&lt;a href=&quot;#优点&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;✅ 视觉冲击力强，封面图吸引眼球&lt;/li&gt;
&lt;li&gt;✅ 可以展示更多文章信息（摘要、标签等）&lt;/li&gt;
&lt;li&gt;✅ 适合图片内容丰富的博客&lt;/li&gt;
&lt;li&gt;✅ 移动端友好，单列更易阅读&lt;/li&gt;
&lt;li&gt;✅ 兼容所有侧边栏配置（单侧、双侧）&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/siteConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;siteConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SiteConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;postListLayout&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;defaultMode&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;list&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 列表模式&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;allowSwitch&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,   &lt;/span&gt;&lt;span&gt;// 允许用户切换&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.2 网格模式 (defaultMode: “grid”)&lt;a href=&quot;#22-网格模式-defaultmode-grid&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点-3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;自适应列数，根据浏览器宽度自动调整&lt;/li&gt;
&lt;li&gt;紧凑布局，信息密度高&lt;/li&gt;
&lt;li&gt;适合快速浏览&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;自适应网格&lt;a href=&quot;#自适应网格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;网格模式通过 &lt;code&gt;columnWidth&lt;/code&gt; 配置卡片的最小宽度（单位 px），浏览器会根据容器可用宽度自动计算能容纳多少列。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp&quot; srcset=&quot;/_astro/left-grid3.DCIbm9j3_aED3D.webp 640w, /_astro/left-grid3.DCIbm9j3_ZKzKs3.webp 750w, /_astro/left-grid3.DCIbm9j3_ZqcTCb.webp 828w, /_astro/left-grid3.DCIbm9j3_gjdwz.webp 1080w, /_astro/left-grid3.DCIbm9j3_22TUla.webp 1280w, /_astro/left-grid3.DCIbm9j3_ZHnOlo.webp 1668w, /_astro/left-grid3.DCIbm9j3_ZIg0jq.webp 2048w, /_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp 2192w&quot; /&gt;&lt;figcaption&gt;网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例-3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/siteConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;siteConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SiteConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;postListLayout&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;defaultMode&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;grid&quot;&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;allowSwitch&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;grid&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;      &lt;/span&gt;&lt;span&gt;masonry&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,      &lt;/span&gt;&lt;span&gt;// 开启瀑布流&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;      &lt;/span&gt;&lt;span&gt;columnWidth&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;320&lt;/span&gt;&lt;span&gt;,   &lt;/span&gt;&lt;span&gt;// 卡片最小宽度(px)，浏览器自动计算列数&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.3 瀑布流布局 (Masonry)&lt;a href=&quot;#23-瀑布流布局-masonry&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Firefly 的网格模式内置了智能瀑布流布局支持，解决了网格布局中因图文混合文章导致的卡片高度不一致导致的空白问题。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;瀑布流布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/masonry.BgzRsBcp_2mfpqn.webp&quot; srcset=&quot;/_astro/masonry.BgzRsBcp_Q6h0.webp 640w, /_astro/masonry.BgzRsBcp_Z1iSuyb.webp 750w, /_astro/masonry.BgzRsBcp_2mj2SJ.webp 828w, /_astro/masonry.BgzRsBcp_19DifP.webp 1080w, /_astro/masonry.BgzRsBcp_ZGipcR.webp 1280w, /_astro/masonry.BgzRsBcp_1XuHi6.webp 1668w, /_astro/masonry.BgzRsBcp_ZwgGla.webp 2048w, /_astro/masonry.BgzRsBcp_2mfpqn.webp 2192w&quot; /&gt;&lt;figcaption&gt;瀑布流布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;智能排版&lt;/strong&gt;：自动将卡片放置到最短的列，最大化利用垂直空间。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;消除空白&lt;/strong&gt;：通过绝对定位精确计算每个卡片的位置，让卡片紧贴上方卡片，消除垂直方向的空白间隙。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;自适应列数&lt;/strong&gt;：瀑布流同样根据 &lt;code&gt;columnWidth&lt;/code&gt; 和容器宽度动态计算列数，无需固定配置。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;配置灵活&lt;/strong&gt;：您可以在 &lt;code&gt;siteConfig.ts&lt;/code&gt; 中通过 &lt;code&gt;postListLayout.grid.masonry&lt;/code&gt; 选项自由开启或关闭此功能。&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;三、布局组合指南&lt;a href=&quot;#三布局组合指南&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 允许您自由组合侧边栏和文章列表布局。以下是各种组合的效果说明。&lt;/p&gt;


































&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;侧边栏模式&lt;/th&gt;&lt;th&gt;文章列表模式&lt;/th&gt;&lt;th&gt;推荐度&lt;/th&gt;&lt;th&gt;适用场景&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;单侧边栏&lt;/td&gt;&lt;td&gt;列表模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;摄影、设计、生活类博客，强调图片和沉浸感&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;单侧边栏&lt;/td&gt;&lt;td&gt;网格模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;技术、笔记类博客，平衡阅读与检索效率&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;双侧边栏&lt;/td&gt;&lt;td&gt;列表模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;需要展示大量侧边栏信息的站点&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;双侧边栏&lt;/td&gt;&lt;td&gt;网格模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;极客风格，追求最高信息密度&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;四、响应式布局行为&lt;a href=&quot;#四响应式布局行为&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 的布局系统具有智能的响应式设计，会根据屏幕尺寸自动调整。&lt;/p&gt;&lt;p&gt;为了保证最佳阅读体验，系统会在屏幕变窄时自动调整布局：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;网格列数自动减少&lt;/strong&gt;：网格模式的列数由 &lt;code&gt;columnWidth&lt;/code&gt; 和容器宽度自动决定，屏幕越窄列数越少。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;列表模式 -&amp;gt; 网格模式&lt;/strong&gt;：当屏幕宽度小于 380px（超小屏设备）时，列表模式会自动切换为网格模式，以保证卡片内容的可读性。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;双侧边栏 -&amp;gt; 单侧边栏&lt;/strong&gt;：当屏幕宽度小于 1280px 时，会根据&lt;code&gt;tabletSidebar&lt;/code&gt;配置显示单侧边栏，隐藏其中一个侧边栏，文章目录导航会切换成浮动目录导航。&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;五、常见问题&lt;a href=&quot;#五常见问题&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;Q1: 如何调整网格列数？&lt;a href=&quot;#q1-如何调整网格列数&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;strong&gt;A&lt;/strong&gt;: 通过 &lt;code&gt;columnWidth&lt;/code&gt; 配置卡片最小宽度即可。值越小，同等宽度下列数越多；值越大，列数越少。浏览器会自动根据可用宽度计算最佳列数。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;六、总结&lt;a href=&quot;#六总结&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 的布局系统给予了您更大的自由度，您都可以通过简单的配置实现。&lt;/p&gt;&lt;p&gt;我们建议您根据自己的内容类型和目标读者的设备偏好，尝试不同的组合，找到最适合您的博客形态。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;相关链接&lt;a href=&quot;#相关链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;📚 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/config/sidebarConfig-usage/&quot; target=&quot;_blank&quot;&gt;侧边栏配置文档&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;📚 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/config/siteConfig-usage/&quot; target=&quot;_blank&quot;&gt;站点配置文档&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;🏠 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/&quot; target=&quot;_blank&quot;&gt;Firefly 官方文档&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;⭐ &lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;Firefly GitHub&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;</content:encoded></item><item><title>Firefly 代码块示例</title><link>https://firefly.cuteleaf.cn/posts/code-examples/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/code-examples/</guid><description>在Firefly中使用表达性代码的代码块在 Markdown 中的外观。</description><pubDate>Sat, 03 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;在这里，我们将探索如何使用 &lt;a href=&quot;https://expressive-code.com/&quot; target=&quot;_blank&quot;&gt;Expressive Code&lt;/a&gt; 展示代码块。提供的示例基于官方文档，您可以参考以获取更多详细信息。&lt;/p&gt;
&lt;section&gt;&lt;h2&gt;表达性代码&lt;a href=&quot;#表达性代码&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;语法高亮&lt;a href=&quot;#语法高亮&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;a href=&quot;https://expressive-code.com/key-features/syntax-highlighting/&quot; target=&quot;_blank&quot;&gt;语法高亮&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h4&gt;常规语法高亮&lt;a href=&quot;#常规语法高亮&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;此代码有语法高亮!&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;渲染 ANSI 转义序列&lt;a href=&quot;#渲染-ansi-转义序列&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Terminal window&lt;/span&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Standard ANSI colors:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Dimmed:     &lt;/span&gt;&lt;span&gt; Black &lt;/span&gt;&lt;span&gt; Red &lt;/span&gt;&lt;span&gt; Green &lt;/span&gt;&lt;span&gt; Yellow &lt;/span&gt;&lt;span&gt; Blue &lt;/span&gt;&lt;span&gt; Magenta &lt;/span&gt;&lt;span&gt; Cyan &lt;/span&gt;&lt;span&gt; White &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Foreground: &lt;/span&gt;&lt;span&gt; Black &lt;/span&gt;&lt;span&gt; Red &lt;/span&gt;&lt;span&gt; Green &lt;/span&gt;&lt;span&gt; Yellow &lt;/span&gt;&lt;span&gt; Blue &lt;/span&gt;&lt;span&gt; Magenta &lt;/span&gt;&lt;span&gt; Cyan &lt;/span&gt;&lt;span&gt; White &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Background: &lt;/span&gt;&lt;span&gt; Black &lt;/span&gt;&lt;span&gt; Red &lt;/span&gt;&lt;span&gt; Green &lt;/span&gt;&lt;span&gt; Yellow &lt;/span&gt;&lt;span&gt; Blue &lt;/span&gt;&lt;span&gt; Magenta &lt;/span&gt;&lt;span&gt; Cyan &lt;/span&gt;&lt;span&gt; White &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Reversed:   &lt;/span&gt;&lt;span&gt; Black &lt;/span&gt;&lt;span&gt; Red &lt;/span&gt;&lt;span&gt; Green &lt;/span&gt;&lt;span&gt; Yellow &lt;/span&gt;&lt;span&gt; Blue &lt;/span&gt;&lt;span&gt; Magenta &lt;/span&gt;&lt;span&gt; Cyan &lt;/span&gt;&lt;span&gt; White &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;8-bit colors (showing colors 160-171 as an example):&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Dimmed:     &lt;/span&gt;&lt;span&gt; 160 &lt;/span&gt;&lt;span&gt; 161 &lt;/span&gt;&lt;span&gt; 162 &lt;/span&gt;&lt;span&gt; 163 &lt;/span&gt;&lt;span&gt; 164 &lt;/span&gt;&lt;span&gt; 165 &lt;/span&gt;&lt;span&gt; 166 &lt;/span&gt;&lt;span&gt; 167 &lt;/span&gt;&lt;span&gt; 168 &lt;/span&gt;&lt;span&gt; 169 &lt;/span&gt;&lt;span&gt; 170 &lt;/span&gt;&lt;span&gt; 171 &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Foreground: &lt;/span&gt;&lt;span&gt; 160 &lt;/span&gt;&lt;span&gt; 161 &lt;/span&gt;&lt;span&gt; 162 &lt;/span&gt;&lt;span&gt; 163 &lt;/span&gt;&lt;span&gt; 164 &lt;/span&gt;&lt;span&gt; 165 &lt;/span&gt;&lt;span&gt; 166 &lt;/span&gt;&lt;span&gt; 167 &lt;/span&gt;&lt;span&gt; 168 &lt;/span&gt;&lt;span&gt; 169 &lt;/span&gt;&lt;span&gt; 170 &lt;/span&gt;&lt;span&gt; 171 &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Background: &lt;/span&gt;&lt;span&gt; 160 &lt;/span&gt;&lt;span&gt; 161 &lt;/span&gt;&lt;span&gt; 162 &lt;/span&gt;&lt;span&gt; 163 &lt;/span&gt;&lt;span&gt; 164 &lt;/span&gt;&lt;span&gt; 165 &lt;/span&gt;&lt;span&gt; 166 &lt;/span&gt;&lt;span&gt; 167 &lt;/span&gt;&lt;span&gt; 168 &lt;/span&gt;&lt;span&gt; 169 &lt;/span&gt;&lt;span&gt; 170 &lt;/span&gt;&lt;span&gt; 171 &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Reversed:   &lt;/span&gt;&lt;span&gt; 160 &lt;/span&gt;&lt;span&gt; 161 &lt;/span&gt;&lt;span&gt; 162 &lt;/span&gt;&lt;span&gt; 163 &lt;/span&gt;&lt;span&gt; 164 &lt;/span&gt;&lt;span&gt; 165 &lt;/span&gt;&lt;span&gt; 166 &lt;/span&gt;&lt;span&gt; 167 &lt;/span&gt;&lt;span&gt; 168 &lt;/span&gt;&lt;span&gt; 169 &lt;/span&gt;&lt;span&gt; 170 &lt;/span&gt;&lt;span&gt; 171 &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;24-bit colors (full RGB):&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Dimmed:     &lt;/span&gt;&lt;span&gt; ForestGreen - RGB(34,139,34) &lt;/span&gt;&lt;span&gt; RebeccaPurple - RGB(102,51,153) &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Foreground: &lt;/span&gt;&lt;span&gt; ForestGreen - RGB(34,139,34) &lt;/span&gt;&lt;span&gt; RebeccaPurple - RGB(102,51,153) &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Background: &lt;/span&gt;&lt;span&gt; ForestGreen - RGB(34,139,34) &lt;/span&gt;&lt;span&gt; RebeccaPurple - RGB(102,51,153) &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Reversed:   &lt;/span&gt;&lt;span&gt; ForestGreen - RGB(34,139,34) &lt;/span&gt;&lt;span&gt; RebeccaPurple - RGB(102,51,153) &lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Font styles:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- Default&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- &lt;/span&gt;&lt;span&gt;Bold&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- &lt;/span&gt;&lt;span&gt;Dimmed&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- &lt;/span&gt;&lt;span&gt;Italic&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- &lt;/span&gt;&lt;span&gt;Underline&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- &lt;/span&gt;&lt;span&gt;Reversed&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- &lt;/span&gt;&lt;span&gt;Strikethrough&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;编辑器和终端框架&lt;a href=&quot;#编辑器和终端框架&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;a href=&quot;https://expressive-code.com/key-features/frames/&quot; target=&quot;_blank&quot;&gt;编辑器和终端框架&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h4&gt;代码编辑器框架&lt;a href=&quot;#代码编辑器框架&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;my-test-file.js&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;标题属性示例&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/content/index.html&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;&lt;/span&gt;&lt;span&gt;div&lt;/span&gt;&lt;span&gt;&amp;gt;文件名注释示例&amp;lt;/&lt;/span&gt;&lt;span&gt;div&lt;/span&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;终端框架&lt;a href=&quot;#终端框架&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Terminal window&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;echo&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;此终端框架没有标题&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;PowerShell 终端示例&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Write-Output&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;这个有标题!&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;覆盖框架类型&lt;a href=&quot;#覆盖框架类型&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;echo&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;看，没有框架!&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;PowerShell Profile.ps1&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 如果不覆盖，这将是一个终端框架&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;Watch-Tail&lt;/span&gt;&lt;span&gt; { &lt;/span&gt;&lt;span&gt;Get-Content&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;-&lt;/span&gt;&lt;span&gt;Tail &lt;/span&gt;&lt;/span&gt;&lt;span&gt;20&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;-&lt;/span&gt;&lt;span&gt;Wait $args }&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;New-Alias&lt;/span&gt;&lt;span&gt; tail &lt;/span&gt;&lt;span&gt;Watch-Tail&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;文本和行标记&lt;a href=&quot;#文本和行标记&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;a href=&quot;https://expressive-code.com/key-features/text-markers/&quot; target=&quot;_blank&quot;&gt;文本和行标记&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h4&gt;标记整行和行范围&lt;a href=&quot;#标记整行和行范围&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第1行 - 通过行号定位&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第2行&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第3行&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第4行 - 通过行号定位&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第5行&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第6行&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第7行 - 通过范围 &quot;7-8&quot; 定位&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 第8行 - 通过范围 &quot;7-8&quot; 定位&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;选择行标记类型 (mark, ins, del)&lt;a href=&quot;#选择行标记类型-mark-ins-del&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;line-markers.js&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;demo&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;此行标记为已删除&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// 此行和下一行标记为已插入&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;这是第二个插入行&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;此行使用中性默认标记类型&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;为行标记添加标签&lt;a href=&quot;#为行标记添加标签&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;labeled-line-markers.jsx&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;&lt;/span&gt;&lt;span&gt;button&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;role&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&quot;button&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;...&lt;/span&gt;&lt;span&gt;props&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;value&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;value&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;className&lt;/span&gt;&lt;span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;buttonClassName&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;disabled&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;disabled&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;active&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;active&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&amp;amp;&amp;amp;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;!&lt;/span&gt;&lt;span&gt;active&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&amp;amp;&amp;amp;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span&gt;typeof&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;===&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;string&apos;&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;?&lt;/span&gt;&lt;span&gt; &amp;lt;&lt;/span&gt;&lt;span&gt;span&lt;/span&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;span&gt;&amp;lt;/&lt;/span&gt;&lt;span&gt;span&lt;/span&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/&lt;/span&gt;&lt;span&gt;button&lt;/span&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;在单独行上添加长标签&lt;a href=&quot;#在单独行上添加长标签&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;labeled-line-markers.jsx&lt;/span&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;&lt;/span&gt;&lt;span&gt;button&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;role&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&quot;button&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;...&lt;/span&gt;&lt;span&gt;props&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;value&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;value&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;className&lt;/span&gt;&lt;span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;buttonClassName&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;disabled&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;disabled&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;active&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;active&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&amp;amp;&amp;amp;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;!&lt;/span&gt;&lt;span&gt;active&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&amp;amp;&amp;amp;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span&gt;typeof&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;===&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;string&apos;&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;?&lt;/span&gt;&lt;span&gt; &amp;lt;&lt;/span&gt;&lt;span&gt;span&lt;/span&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;span&gt;{&lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;span&gt;&amp;lt;/&lt;/span&gt;&lt;span&gt;span&lt;/span&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;children&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/&lt;/span&gt;&lt;span&gt;button&lt;/span&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;使用类似 diff 的语法&lt;a href=&quot;#使用类似-diff-的语法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;此行将标记为已插入&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;此行将标记为已删除&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;这是常规行&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;--- a/README.md&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+++ b/README.md&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;@@ -1,3 +1,4 @@&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+this is an actual diff file&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-all contents will remain unmodified&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;no whitespace will be removed either&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;结合语法高亮和类似 diff 的语法&lt;a href=&quot;#结合语法高亮和类似-diff-的语法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;thisIsJavaScript&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// 整个块都会以 JavaScript 高亮显示，&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// 并且我们仍然可以为其添加 diff 标记！&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;要删除的旧代码&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;新的闪亮代码！&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;标记行内的单独文本&lt;a href=&quot;#标记行内的单独文本&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;demo&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// 标记行内的任何给定文本&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;支持给定文本的多个匹配项&apos;&lt;/span&gt;&lt;span&gt;;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;正则表达式&lt;a href=&quot;#正则表达式&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;单词 &lt;/span&gt;&lt;mark&gt;&lt;span&gt;yes&lt;/span&gt;&lt;/mark&gt;&lt;span&gt; 和 &lt;/span&gt;&lt;mark&gt;&lt;span&gt;yep&lt;/span&gt;&lt;/mark&gt;&lt;span&gt; 将被标记。&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;转义正斜杠&lt;a href=&quot;#转义正斜杠&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Terminal window&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;echo&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;Test&quot;&lt;/span&gt;&lt;span&gt; &amp;gt; &lt;/span&gt;&lt;mark&gt;&lt;span&gt;/home/&lt;/span&gt;&lt;/mark&gt;&lt;span&gt;test.txt&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;选择内联标记类型 (mark, ins, del)&lt;a href=&quot;#选择内联标记类型-mark-ins-del&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;demo&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;这些是插入和删除的标记类型&apos;&lt;/span&gt;&lt;span&gt;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// return 语句使用默认标记类型&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;mark&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;;&lt;/span&gt;&lt;/mark&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;自动换行&lt;a href=&quot;#自动换行&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;a href=&quot;https://expressive-code.com/key-features/word-wrap/&quot; target=&quot;_blank&quot;&gt;自动换行&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h4&gt;为每个块配置自动换行&lt;a href=&quot;#为每个块配置自动换行&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 启用换行的示例&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;getLongString&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;这是一个非常长的字符串，除非容器极宽，否则很可能无法适应可用空间&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// wrap=false 的示例&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;getLongString&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;这是一个非常长的字符串，除非容器极宽，否则很可能无法适应可用空间&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置换行的缩进&lt;a href=&quot;#配置换行的缩进&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// preserveIndent 示例（默认启用）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;getLongString&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;这是一个非常长的字符串，除非容器极宽，否则很可能无法适应可用空间&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// preserveIndent=false 的示例&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;getLongString&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;这是一个非常长的字符串，除非容器极宽，否则很可能无法适应可用空间&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;可折叠部分&lt;a href=&quot;#可折叠部分&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a href=&quot;https://expressive-code.com/plugins/collapsible-sections/&quot; target=&quot;_blank&quot;&gt;可折叠部分&lt;/a&gt;&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;5 collapsed lines&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 所有这些样板设置代码将被折叠&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;import&lt;/span&gt;&lt;span&gt; { &lt;/span&gt;&lt;span&gt;someBoilerplateEngine&lt;/span&gt;&lt;span&gt; } &lt;/span&gt;&lt;span&gt;from&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;@example/some-boilerplate&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;import&lt;/span&gt;&lt;span&gt; { &lt;/span&gt;&lt;span&gt;evenMoreBoilerplate&lt;/span&gt;&lt;span&gt; } &lt;/span&gt;&lt;span&gt;from&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;@example/even-more-boilerplate&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;engine&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;someBoilerplateEngine&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;evenMoreBoilerplate&lt;/span&gt;&lt;span&gt;())&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 这部分代码默认可见&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;engine&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;doSomething&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;1&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;3&lt;/span&gt;&lt;span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;calcFn&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;calcFn&lt;/span&gt;&lt;span&gt;() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// 您可以有多个折叠部分&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;3 collapsed lines&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;a&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;b&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;c&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;a&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;b&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// 这将保持可见&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;`计算结果: &lt;/span&gt;&lt;span&gt;${&lt;/span&gt;&lt;span&gt;a&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;span&gt; + &lt;/span&gt;&lt;span&gt;${&lt;/span&gt;&lt;span&gt;b&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;${&lt;/span&gt;&lt;span&gt;c&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;span&gt;`&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;return&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;c&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;4 collapsed lines&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 直到块末尾的所有代码将再次被折叠&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;engine&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;closeConnection&lt;/span&gt;&lt;span&gt;()&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;engine&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;freeMemory&lt;/span&gt;&lt;span&gt;()&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;engine&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;shutdown&lt;/span&gt;&lt;span&gt;({ &lt;/span&gt;&lt;span&gt;reason&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&apos;示例样板代码结束&apos;&lt;/span&gt;&lt;span&gt; })&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;行号&lt;a href=&quot;#行号&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a href=&quot;https://expressive-code.com/plugins/line-numbers/&quot; target=&quot;_blank&quot;&gt;行号&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;为每个块显示行号&lt;a href=&quot;#为每个块显示行号&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// 此代码块将显示行号&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;来自第2行的问候!&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;我在第3行&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;// 此块禁用行号&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;你好?&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;抱歉，你知道我在第几行吗?&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;更改起始行号&lt;a href=&quot;#更改起始行号&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;来自第5行的问候!&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;console&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;log&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&apos;我在第6行&apos;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>Firefly 布局系统详解</title><link>https://firefly.cuteleaf.cn/posts/firefly-layout-system/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/firefly-layout-system/</guid><description>深入了解 Firefly 的布局系统，包括侧边栏布局（左侧/双侧）和文章列表布局（列表/网格），以及自适应网格列数。</description><pubDate>Sat, 03 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;📖 概述&lt;a href=&quot;#-概述&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 提供了灵活的布局系统，允许您根据内容需求和个人喜好自定义博客的视觉呈现方式。布局系统主要包括&lt;strong&gt;侧边栏布局&lt;/strong&gt;和&lt;strong&gt;文章列表布局&lt;/strong&gt;两个维度，它们相互配合，共同决定了页面的整体结构。&lt;/p&gt;&lt;p&gt;本文将详细介绍 Firefly 的各种布局模式、它们的特点、使用场景，以及不同布局组合的效果。&lt;/p&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;img alt=&quot;左侧边栏+列表布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-list.CdJfuugk_23fiFf.webp&quot; srcset=&quot;/_astro/left-list.CdJfuugk_Z1mA0Ez.webp 640w, /_astro/left-list.CdJfuugk_Z10qgrr.webp 750w, /_astro/left-list.CdJfuugk_Z2cj349.webp 828w, /_astro/left-list.CdJfuugk_u3eLs.webp 1080w, /_astro/left-list.CdJfuugk_2fAX5y.webp 1280w, /_astro/left-list.CdJfuugk_2oEKUW.webp 1668w, /_astro/left-list.CdJfuugk_Z1KIWFC.webp 2048w, /_astro/left-list.CdJfuugk_23fiFf.webp 2192w&quot; /&gt;&lt;figcaption&gt;左侧边栏+列表布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;右侧边栏+网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp&quot; srcset=&quot;/_astro/right-grid2.BDLeNFG9_26ckzG.webp 640w, /_astro/right-grid2.BDLeNFG9_1tKDP4.webp 750w, /_astro/right-grid2.BDLeNFG9_Z1CTouC.webp 828w, /_astro/right-grid2.BDLeNFG9_27C8ym.webp 1080w, /_astro/right-grid2.BDLeNFG9_ZDs3VJ.webp 1280w, /_astro/right-grid2.BDLeNFG9_Z20DfDW.webp 1668w, /_astro/right-grid2.BDLeNFG9_ZiVVYz.webp 2048w, /_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp 2192w&quot; /&gt;&lt;figcaption&gt;右侧边栏+网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;左侧边栏+三列网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp&quot; srcset=&quot;/_astro/left-grid3.DCIbm9j3_aED3D.webp 640w, /_astro/left-grid3.DCIbm9j3_ZKzKs3.webp 750w, /_astro/left-grid3.DCIbm9j3_ZqcTCb.webp 828w, /_astro/left-grid3.DCIbm9j3_gjdwz.webp 1080w, /_astro/left-grid3.DCIbm9j3_22TUla.webp 1280w, /_astro/left-grid3.DCIbm9j3_ZHnOlo.webp 1668w, /_astro/left-grid3.DCIbm9j3_ZIg0jq.webp 2048w, /_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp 2192w&quot; /&gt;&lt;figcaption&gt;左侧边栏+三列网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;/div&gt;&lt;div&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+列表布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-list.CybtDZTU_xxVkb.webp&quot; srcset=&quot;/_astro/both-list.CybtDZTU_Z1JydKr.webp 640w, /_astro/both-list.CybtDZTU_Z1notxj.webp 750w, /_astro/both-list.CybtDZTU_2uTRDU.webp 828w, /_astro/both-list.CybtDZTU_Z10D7yB.webp 1080w, /_astro/both-list.CybtDZTU_JTAJu.webp 1280w, /_astro/both-list.CybtDZTU_SXozS.webp 1668w, /_astro/both-list.CybtDZTU_1NKNMf.webp 2048w, /_astro/both-list.CybtDZTU_xxVkb.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+列表布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-grid.B-BFe9Al_1g1tLj.webp&quot; srcset=&quot;/_astro/both-grid.B-BFe9Al_SVz9I.webp 640w, /_astro/both-grid.B-BFe9Al_1g6jmQ.webp 750w, /_astro/both-grid.B-BFe9Al_4dwK9.webp 828w, /_astro/both-grid.B-BFe9Al_Ziaz7t.webp 1080w, /_astro/both-grid.B-BFe9Al_1sn9bC.webp 1280w, /_astro/both-grid.B-BFe9Al_1BqW21.webp 1668w, /_astro/both-grid.B-BFe9Al_2wemen.webp 2048w, /_astro/both-grid.B-BFe9Al_1g1tLj.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+网格瀑布流布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/masonry.BgzRsBcp_2mfpqn.webp&quot; srcset=&quot;/_astro/masonry.BgzRsBcp_Q6h0.webp 640w, /_astro/masonry.BgzRsBcp_Z1iSuyb.webp 750w, /_astro/masonry.BgzRsBcp_2mj2SJ.webp 828w, /_astro/masonry.BgzRsBcp_19DifP.webp 1080w, /_astro/masonry.BgzRsBcp_ZGipcR.webp 1280w, /_astro/masonry.BgzRsBcp_1XuHi6.webp 1668w, /_astro/masonry.BgzRsBcp_ZwgGla.webp 2048w, /_astro/masonry.BgzRsBcp_2mfpqn.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+网格瀑布流布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;一、侧边栏布局系统&lt;a href=&quot;#一侧边栏布局系统&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;侧边栏是博客页面的重要组成部分，用于展示导航、分类、标签、统计信息等辅助内容。Firefly 支持两种侧边栏布局模式。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;1.1 单侧边栏模式&lt;a href=&quot;#11-单侧边栏模式&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;左侧边栏 (position: “left”)&lt;a href=&quot;#左侧边栏-position-left&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;左侧边栏布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-list.CdJfuugk_23fiFf.webp&quot; srcset=&quot;/_astro/left-list.CdJfuugk_Z1mA0Ez.webp 640w, /_astro/left-list.CdJfuugk_Z10qgrr.webp 750w, /_astro/left-list.CdJfuugk_Z2cj349.webp 828w, /_astro/left-list.CdJfuugk_u3eLs.webp 1080w, /_astro/left-list.CdJfuugk_2fAX5y.webp 1280w, /_astro/left-list.CdJfuugk_2oEKUW.webp 1668w, /_astro/left-list.CdJfuugk_Z1KIWFC.webp 2048w, /_astro/left-list.CdJfuugk_23fiFf.webp 2192w&quot; /&gt;&lt;figcaption&gt;左侧边栏布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;右侧边栏 (position: “right”)&lt;a href=&quot;#右侧边栏-position-right&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;右侧边栏布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp&quot; srcset=&quot;/_astro/right-grid2.BDLeNFG9_26ckzG.webp 640w, /_astro/right-grid2.BDLeNFG9_1tKDP4.webp 750w, /_astro/right-grid2.BDLeNFG9_Z1CTouC.webp 828w, /_astro/right-grid2.BDLeNFG9_27C8ym.webp 1080w, /_astro/right-grid2.BDLeNFG9_ZDs3VJ.webp 1280w, /_astro/right-grid2.BDLeNFG9_Z20DfDW.webp 1668w, /_astro/right-grid2.BDLeNFG9_ZiVVYz.webp 2048w, /_astro/right-grid2.BDLeNFG9_Z1Ypd95.webp 2192w&quot; /&gt;&lt;figcaption&gt;右侧边栏布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;侧边栏固定在页面其中一侧&lt;/li&gt;
&lt;li&gt;文章阅读区域体验更佳，更宽敞&lt;/li&gt;
&lt;li&gt;更加简约，没有那么紧凑&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;适用场景&lt;a href=&quot;#适用场景&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;传统博客风格&lt;/li&gt;
&lt;li&gt;强调导航和分类的博客&lt;/li&gt;
&lt;li&gt;需要突出用户资料的个人博客&lt;/li&gt;
&lt;li&gt;内容为主，辅助信息次之的场景&lt;/li&gt;
&lt;/ul&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;Tip&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;p&gt;可以通过showBothSidebarsOnPostPage配置是否在文章详情页显示双侧边栏&lt;/p&gt;&lt;p&gt;当position为left或right时开启此项后，文章详情页将显示双侧边栏，主页等其他页面保持单侧边栏&lt;/p&gt;&lt;p&gt;适用在只想用单侧栏，但在文章详情页想用对侧栏的目录等组件的场景&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/sidebarConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;sidebarLayoutConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SidebarLayoutConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;enable&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;position&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;left&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 左侧边栏&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;showBothSidebarsOnPostPage&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 是否在文章详情页显示双侧边栏&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;1.2 双侧边栏模式 (position: “both”)&lt;a href=&quot;#12-双侧边栏模式-position-both&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;左右两侧同时存在侧边栏&lt;/li&gt;
&lt;li&gt;主内容区域位于中间&lt;/li&gt;
&lt;li&gt;最大化利用屏幕空间&lt;/li&gt;
&lt;li&gt;可以展示更多辅助信息&lt;/li&gt;
&lt;li&gt;适合宽屏显示器&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;布局结构&lt;a href=&quot;#布局结构&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+列表布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-list.CybtDZTU_xxVkb.webp&quot; srcset=&quot;/_astro/both-list.CybtDZTU_Z1JydKr.webp 640w, /_astro/both-list.CybtDZTU_Z1notxj.webp 750w, /_astro/both-list.CybtDZTU_2uTRDU.webp 828w, /_astro/both-list.CybtDZTU_Z10D7yB.webp 1080w, /_astro/both-list.CybtDZTU_JTAJu.webp 1280w, /_astro/both-list.CybtDZTU_SXozS.webp 1668w, /_astro/both-list.CybtDZTU_1NKNMf.webp 2048w, /_astro/both-list.CybtDZTU_xxVkb.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+列表布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;双侧边栏+网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/both-grid.B-BFe9Al_1g1tLj.webp&quot; srcset=&quot;/_astro/both-grid.B-BFe9Al_SVz9I.webp 640w, /_astro/both-grid.B-BFe9Al_1g6jmQ.webp 750w, /_astro/both-grid.B-BFe9Al_4dwK9.webp 828w, /_astro/both-grid.B-BFe9Al_Ziaz7t.webp 1080w, /_astro/both-grid.B-BFe9Al_1sn9bC.webp 1280w, /_astro/both-grid.B-BFe9Al_1BqW21.webp 1668w, /_astro/both-grid.B-BFe9Al_2wemen.webp 2048w, /_astro/both-grid.B-BFe9Al_1g1tLj.webp 2192w&quot; /&gt;&lt;figcaption&gt;双侧边栏+网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;适用场景&lt;a href=&quot;#适用场景-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;宽屏桌面端浏览&lt;/li&gt;
&lt;li&gt;信息密集型博客&lt;/li&gt;
&lt;li&gt;需要展示大量辅助内容&lt;/li&gt;
&lt;li&gt;专业性强的技术博客&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/sidebarConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;sidebarLayoutConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SidebarLayoutConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;enable&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;position&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;both&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 双侧边栏&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;二、文章列表布局系统&lt;a href=&quot;#二文章列表布局系统&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;文章列表是博客首页和归档页的核心内容，Firefly 提供两种展示方式，并支持多种网格配置。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;2.1 列表模式 (defaultMode: “list”)&lt;a href=&quot;#21-列表模式-defaultmode-list&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;单列纵向排列&lt;/li&gt;
&lt;li&gt;显示文章封面图&lt;/li&gt;
&lt;li&gt;展示更多文章摘要&lt;/li&gt;
&lt;li&gt;适合深度阅读&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;列表布局结构&lt;a href=&quot;#列表布局结构&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;列表模式布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-list.CdJfuugk_23fiFf.webp&quot; srcset=&quot;/_astro/left-list.CdJfuugk_Z1mA0Ez.webp 640w, /_astro/left-list.CdJfuugk_Z10qgrr.webp 750w, /_astro/left-list.CdJfuugk_Z2cj349.webp 828w, /_astro/left-list.CdJfuugk_u3eLs.webp 1080w, /_astro/left-list.CdJfuugk_2fAX5y.webp 1280w, /_astro/left-list.CdJfuugk_2oEKUW.webp 1668w, /_astro/left-list.CdJfuugk_Z1KIWFC.webp 2048w, /_astro/left-list.CdJfuugk_23fiFf.webp 2192w&quot; /&gt;&lt;figcaption&gt;列表模式布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;优点&lt;a href=&quot;#优点&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;✅ 视觉冲击力强，封面图吸引眼球&lt;/li&gt;
&lt;li&gt;✅ 可以展示更多文章信息（摘要、标签等）&lt;/li&gt;
&lt;li&gt;✅ 适合图片内容丰富的博客&lt;/li&gt;
&lt;li&gt;✅ 移动端友好，单列更易阅读&lt;/li&gt;
&lt;li&gt;✅ 兼容所有侧边栏配置（单侧、双侧）&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/siteConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;siteConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SiteConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;postListLayout&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;defaultMode&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;list&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;// 列表模式&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;allowSwitch&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,   &lt;/span&gt;&lt;span&gt;// 允许用户切换&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.2 网格模式 (defaultMode: “grid”)&lt;a href=&quot;#22-网格模式-defaultmode-grid&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;特点&lt;a href=&quot;#特点-3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;ul&gt;
&lt;li&gt;自适应列数，根据浏览器宽度自动调整&lt;/li&gt;
&lt;li&gt;紧凑布局，信息密度高&lt;/li&gt;
&lt;li&gt;适合快速浏览&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;自适应网格&lt;a href=&quot;#自适应网格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;网格模式通过 &lt;code&gt;columnWidth&lt;/code&gt; 配置卡片的最小宽度（单位 px），浏览器会根据容器可用宽度自动计算能容纳多少列。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;网格布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp&quot; srcset=&quot;/_astro/left-grid3.DCIbm9j3_aED3D.webp 640w, /_astro/left-grid3.DCIbm9j3_ZKzKs3.webp 750w, /_astro/left-grid3.DCIbm9j3_ZqcTCb.webp 828w, /_astro/left-grid3.DCIbm9j3_gjdwz.webp 1080w, /_astro/left-grid3.DCIbm9j3_22TUla.webp 1280w, /_astro/left-grid3.DCIbm9j3_ZHnOlo.webp 1668w, /_astro/left-grid3.DCIbm9j3_ZIg0jq.webp 2048w, /_astro/left-grid3.DCIbm9j3_Z5Vd5j.webp 2192w&quot; /&gt;&lt;figcaption&gt;网格布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;配置示例&lt;a href=&quot;#配置示例-3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/siteConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;siteConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SiteConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;postListLayout&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;defaultMode&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;grid&quot;&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;allowSwitch&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;grid&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;      &lt;/span&gt;&lt;span&gt;masonry&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;span&gt;,      &lt;/span&gt;&lt;span&gt;// 开启瀑布流&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;      &lt;/span&gt;&lt;span&gt;columnWidth&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;320&lt;/span&gt;&lt;span&gt;,   &lt;/span&gt;&lt;span&gt;// 卡片最小宽度(px)，浏览器自动计算列数&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2.3 瀑布流布局 (Masonry)&lt;a href=&quot;#23-瀑布流布局-masonry&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Firefly 的网格模式内置了智能瀑布流布局支持，解决了网格布局中因图文混合文章导致的卡片高度不一致导致的空白问题。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;瀑布流布局&quot; loading=&quot;lazy&quot; width=&quot;2192&quot; height=&quot;1233&quot; src=&quot;/_astro/masonry.BgzRsBcp_2mfpqn.webp&quot; srcset=&quot;/_astro/masonry.BgzRsBcp_Q6h0.webp 640w, /_astro/masonry.BgzRsBcp_Z1iSuyb.webp 750w, /_astro/masonry.BgzRsBcp_2mj2SJ.webp 828w, /_astro/masonry.BgzRsBcp_19DifP.webp 1080w, /_astro/masonry.BgzRsBcp_ZGipcR.webp 1280w, /_astro/masonry.BgzRsBcp_1XuHi6.webp 1668w, /_astro/masonry.BgzRsBcp_ZwgGla.webp 2048w, /_astro/masonry.BgzRsBcp_2mfpqn.webp 2192w&quot; /&gt;&lt;figcaption&gt;瀑布流布局&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;智能排版&lt;/strong&gt;：自动将卡片放置到最短的列，最大化利用垂直空间。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;消除空白&lt;/strong&gt;：通过绝对定位精确计算每个卡片的位置，让卡片紧贴上方卡片，消除垂直方向的空白间隙。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;自适应列数&lt;/strong&gt;：瀑布流同样根据 &lt;code&gt;columnWidth&lt;/code&gt; 和容器宽度动态计算列数，无需固定配置。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;配置灵活&lt;/strong&gt;：您可以在 &lt;code&gt;siteConfig.ts&lt;/code&gt; 中通过 &lt;code&gt;postListLayout.grid.masonry&lt;/code&gt; 选项自由开启或关闭此功能。&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;三、布局组合指南&lt;a href=&quot;#三布局组合指南&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 允许您自由组合侧边栏和文章列表布局。以下是各种组合的效果说明。&lt;/p&gt;


































&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;侧边栏模式&lt;/th&gt;&lt;th&gt;文章列表模式&lt;/th&gt;&lt;th&gt;推荐度&lt;/th&gt;&lt;th&gt;适用场景&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;单侧边栏&lt;/td&gt;&lt;td&gt;列表模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;摄影、设计、生活类博客，强调图片和沉浸感&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;单侧边栏&lt;/td&gt;&lt;td&gt;网格模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;技术、笔记类博客，平衡阅读与检索效率&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;双侧边栏&lt;/td&gt;&lt;td&gt;列表模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;需要展示大量侧边栏信息的站点&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;双侧边栏&lt;/td&gt;&lt;td&gt;网格模式&lt;/td&gt;&lt;td&gt;⭐⭐⭐⭐⭐&lt;/td&gt;&lt;td&gt;极客风格，追求最高信息密度&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;四、响应式布局行为&lt;a href=&quot;#四响应式布局行为&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 的布局系统具有智能的响应式设计，会根据屏幕尺寸自动调整。&lt;/p&gt;&lt;p&gt;为了保证最佳阅读体验，系统会在屏幕变窄时自动调整布局：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;网格列数自动减少&lt;/strong&gt;：网格模式的列数由 &lt;code&gt;columnWidth&lt;/code&gt; 和容器宽度自动决定，屏幕越窄列数越少。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;列表模式 -&amp;gt; 网格模式&lt;/strong&gt;：当屏幕宽度小于 380px（超小屏设备）时，列表模式会自动切换为网格模式，以保证卡片内容的可读性。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;双侧边栏 -&amp;gt; 单侧边栏&lt;/strong&gt;：当屏幕宽度小于 1280px 时，会根据&lt;code&gt;tabletSidebar&lt;/code&gt;配置显示单侧边栏，隐藏其中一个侧边栏，文章目录导航会切换成浮动目录导航。&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;五、常见问题&lt;a href=&quot;#五常见问题&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;Q1: 如何调整网格列数？&lt;a href=&quot;#q1-如何调整网格列数&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;strong&gt;A&lt;/strong&gt;: 通过 &lt;code&gt;columnWidth&lt;/code&gt; 配置卡片最小宽度即可。值越小，同等宽度下列数越多；值越大，列数越少。浏览器会自动根据可用宽度计算最佳列数。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;六、总结&lt;a href=&quot;#六总结&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 的布局系统给予了您更大的自由度，您都可以通过简单的配置实现。&lt;/p&gt;&lt;p&gt;我们建议您根据自己的内容类型和目标读者的设备偏好，尝试不同的组合，找到最适合您的博客形态。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;相关链接&lt;a href=&quot;#相关链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;📚 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/config/sidebarConfig-usage/&quot; target=&quot;_blank&quot;&gt;侧边栏配置文档&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;📚 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/config/siteConfig-usage/&quot; target=&quot;_blank&quot;&gt;站点配置文档&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;🏠 &lt;a href=&quot;https://docs-firefly.cuteleaf.cn/&quot; target=&quot;_blank&quot;&gt;Firefly 官方文档&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;⭐ &lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;Firefly GitHub&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;</content:encoded></item><item><title>Firefly 文章加密</title><link>https://firefly.cuteleaf.cn/posts/encrypted-demo/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/encrypted-demo/</guid><description>这是一篇密码保护的示例文章，用于演示文章加密功能。</description><pubDate>Fri, 02 Jan 1970 00:00:00 GMT</pubDate><content:encoded>本文已加密保护，请访问网站查看。</content:encoded></item><item><title>KaTeX 数学公式示例</title><link>https://firefly.cuteleaf.cn/posts/katex-math-example/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/katex-math-example/</guid><description>展示 Firefly 主题对 KaTeX 数学公式的支持，包括行内公式、块级公式和复杂数学符号。</description><pubDate>Fri, 02 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;本文展示了 &lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;Firefly&lt;/a&gt; 主题对 KaTeX 数学公式的渲染支持。&lt;/p&gt;
&lt;section&gt;&lt;h2&gt;行内公式 (Inline)&lt;a href=&quot;#行内公式-inline&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;行内公式使用单个 &lt;code&gt;$&lt;/code&gt; 符号包裹。&lt;/p&gt;&lt;p&gt;例如：欧拉公式 &lt;span&gt;&lt;span&gt;eiπ+1=0e^{i\pi} + 1 = 0&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;e&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;iπ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;1&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt; 是数学中最优美的公式之一。&lt;/p&gt;&lt;p&gt;质能方程 &lt;span&gt;&lt;span&gt;E=mc2E = mc^2&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;E&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;m&lt;/span&gt;&lt;span&gt;&lt;span&gt;c&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;2&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt; 也是家喻户晓。&lt;/p&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;块级公式 (Block)&lt;a href=&quot;#块级公式-block&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;块级公式使用两个 &lt;code&gt;$$&lt;/code&gt; 符号包裹，会居中显示。&lt;/p&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;∫−∞∞e−x2dx=π\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∫&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;−&lt;/span&gt;&lt;span&gt;∞&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;∞&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;e&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;−&lt;/span&gt;&lt;span&gt;&lt;span&gt;x&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;2&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;d&lt;/span&gt;&lt;span&gt;x&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;π&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;x=−b±b2−4ac2ax = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;x&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;a&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;−&lt;/span&gt;&lt;span&gt;b&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;±&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;b&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;2&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;−&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;4&lt;/span&gt;&lt;span&gt;a&lt;/span&gt;&lt;span&gt;c&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;复杂示例&lt;a href=&quot;#复杂示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;矩阵 (Matrices)&lt;a href=&quot;#矩阵-matrices&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;(abcd)(αβγδ)=(aα+bγaβ+bδcα+dγcβ+dδ)\begin{pmatrix}
a &amp;amp; b \\
c &amp;amp; d
\end{pmatrix}
\begin{pmatrix}
\alpha &amp;amp; \beta \\
\gamma &amp;amp; \delta
\end{pmatrix} =
\begin{pmatrix}
a\alpha + b\gamma &amp;amp; a\beta + b\delta \\
c\alpha + d\gamma &amp;amp; c\beta + d\delta
\end{pmatrix}&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;a&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;c&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;b&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;d&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;α&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;γ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;β&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;δ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;a&lt;/span&gt;&lt;span&gt;α&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;bγ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;c&lt;/span&gt;&lt;span&gt;α&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;d&lt;/span&gt;&lt;span&gt;γ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;a&lt;/span&gt;&lt;span&gt;β&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;b&lt;/span&gt;&lt;span&gt;δ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;c&lt;/span&gt;&lt;span&gt;β&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;d&lt;/span&gt;&lt;span&gt;δ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;极限与求和 (Limits and Sums)&lt;a href=&quot;#极限与求和-limits-and-sums&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;∑n=1∞1n2=π26\sum_{n=1}^{\infty} \frac{1}{n^2} = \frac{\pi^2}{6}&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;n&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∑&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;∞&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;n&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;2&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;6&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;π&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;2&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;lim⁡x→0sin⁡xx=1\lim_{x \to 0} \frac{\sin x}{x} = 1&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;x&lt;/span&gt;&lt;span&gt;→&lt;/span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;lim&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;x&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;sin&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;x&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;麦克斯韦方程组 (Maxwell’s Equations)&lt;a href=&quot;#麦克斯韦方程组-maxwells-equations&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;∇⋅E=ρε0∇⋅B=0∇×E=−∂B∂t∇×B=μ0J+μ0ε0∂E∂t\begin{aligned}
\nabla \cdot \mathbf{E} &amp;amp;= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &amp;amp;= 0 \\
\nabla \times \mathbf{E} &amp;amp;= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &amp;amp;= \mu_0\mathbf{J} + \mu_0\varepsilon_0\frac{\partial \mathbf{E}}{\partial t}
\end{aligned}&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∇&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;⋅&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;E&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∇&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;⋅&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;B&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∇&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;×&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;E&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∇&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;×&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;B&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;ε&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;ρ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;−&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∂&lt;/span&gt;&lt;span&gt;t&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∂&lt;/span&gt;&lt;span&gt;B&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;μ&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;J&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;μ&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;ε&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∂&lt;/span&gt;&lt;span&gt;t&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;∂&lt;/span&gt;&lt;span&gt;E&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;化学方程式 (Chemical Equations)&lt;a href=&quot;#化学方程式-chemical-equations&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;\ceCH4+2O2−&amp;gt;CO2+2H2O\ce{CH4 + 2O2 -&amp;gt; CO2 + 2H2O}&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;\ce&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span&gt;C&lt;/span&gt;&lt;span&gt;H&lt;/span&gt;&lt;span&gt;4&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;O&lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;−&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;C&lt;/span&gt;&lt;span&gt;O&lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;+&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;H&lt;/span&gt;&lt;span&gt;2&lt;/span&gt;&lt;span&gt;O&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;更多符号&lt;a href=&quot;#更多符号&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;












































&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;符号&lt;/th&gt;&lt;th&gt;代码&lt;/th&gt;&lt;th&gt;渲染结果&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;Alpha&lt;/td&gt;&lt;td&gt;&lt;code&gt;\alpha&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;α\alpha&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;α&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Beta&lt;/td&gt;&lt;td&gt;&lt;code&gt;\beta&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;β\beta&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;β&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Gamma&lt;/td&gt;&lt;td&gt;&lt;code&gt;\Gamma&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;Γ\Gamma&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Γ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Pi&lt;/td&gt;&lt;td&gt;&lt;code&gt;\pi&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;π\pi&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;π&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Infinity&lt;/td&gt;&lt;td&gt;&lt;code&gt;\infty&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;∞\infty&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;∞&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Right Arrow&lt;/td&gt;&lt;td&gt;&lt;code&gt;\rightarrow&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;→\rightarrow&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;→&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Partial&lt;/td&gt;&lt;td&gt;&lt;code&gt;\partial&lt;/code&gt;&lt;/td&gt;&lt;td&gt;&lt;span&gt;&lt;span&gt;∂\partial&lt;/span&gt;&lt;span&gt;&lt;span&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;∂&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;更多 KaTeX 语法请参考 &lt;a href=&quot;https://katex.org/docs/supported.html&quot; target=&quot;_blank&quot;&gt;KaTeX Supported Functions&lt;/a&gt;。&lt;/p&gt;&lt;/section&gt;</content:encoded></item><item><title>Markdown 扩展功能</title><link>https://firefly.cuteleaf.cn/posts/markdown-extended/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/markdown-extended/</guid><description>了解 Firefly 中的 Markdown 功能</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;GitHub 仓库卡片&lt;a href=&quot;#github-仓库卡片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;您可以添加链接到 GitHub 仓库的动态卡片，在页面加载时，仓库信息会从 GitHub API 获取。&lt;/p&gt;&lt;a href=&quot;https://github.com/CuteLeaf/Firefly&quot; target=&quot;_blank&quot;&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;CuteLeaf&lt;/div&gt;&lt;/div&gt;&lt;div&gt;/&lt;/div&gt;&lt;div&gt;Firefly&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;Waiting for api.github.com...&lt;/div&gt;&lt;div&gt;&lt;div&gt;00K&lt;/div&gt;&lt;div&gt;0K&lt;/div&gt;&lt;div&gt;0K&lt;/div&gt;&lt;span&gt;Waiting...&lt;/span&gt;&lt;/div&gt;&lt;/a&gt;&lt;p&gt;使用代码 &lt;code&gt;::github{repo=&quot;CuteLeaf/Firefly&quot;}&lt;/code&gt; 创建 GitHub 仓库卡片。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;::github{repo=&quot;CuteLeaf/Firefly&quot;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;提醒框(Admonitions)配置&lt;a href=&quot;#提醒框admonitions配置&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Firefly 采用了 &lt;a href=&quot;https://github.com/lin-stephanie/rehype-callouts&quot; target=&quot;_blank&quot;&gt;rehype-callouts&lt;/a&gt; 插件，支持了三种风格的提醒框主题：&lt;code&gt;GitHub&lt;/code&gt;、&lt;code&gt;Obsidian&lt;/code&gt; 和 &lt;code&gt;VitePress&lt;/code&gt;。您可以在 &lt;code&gt;src/config/siteConfig.ts&lt;/code&gt; 中进行配置：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;src/config/siteConfig.ts&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;export&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;const&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;siteConfig&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;SiteConfig&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// ...&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;rehypeCallouts&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;// 选项: &quot;github&quot; | &quot;obsidian&quot; | &quot;vitepress&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;    &lt;/span&gt;&lt;span&gt;theme&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&quot;github&quot;&lt;/span&gt;&lt;span&gt;,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;},&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;// ...&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;};&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;注意：&lt;strong&gt;更改配置后需要重启开发服务器才能生效。&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;以下是各个主题支持的类型列表，每个主题风格和语法不同，可根据喜好选择。&lt;/p&gt;&lt;section&gt;&lt;h3&gt;1. GitHub 主题风格&lt;a href=&quot;#1-github-主题风格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;这是 GitHub 官方支持的 5 种基本类型。&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;GitHub&quot; loading=&quot;lazy&quot; width=&quot;2144&quot; height=&quot;1086&quot; src=&quot;/_astro/github.urcbElKG_Z1bC9wS.webp&quot; srcset=&quot;/_astro/github.urcbElKG_pVFO3.webp 640w, /_astro/github.urcbElKG_Zogsaw.webp 750w, /_astro/github.urcbElKG_Z1vPnOl.webp 828w, /_astro/github.urcbElKG_ZdNO71.webp 1080w, /_astro/github.urcbElKG_2lIC61.webp 1280w, /_astro/github.urcbElKG_Z2wFGcQ.webp 1668w, /_astro/github.urcbElKG_22xd9l.webp 2048w, /_astro/github.urcbElKG_Z1bC9wS.webp 2144w&quot; /&gt;&lt;figcaption&gt;GitHub&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;基本语法&lt;/strong&gt;&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!NOTE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; NOTE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 突出显示用户应该考虑的信息。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!TIP&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; TIP&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 可选信息，帮助用户更成功。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!IMPORTANT&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; IMPORTANT&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 用户成功所必需的关键信息。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!WARNING&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; WARNING&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 关键内容，需要立即注意。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!CAUTION&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; CAUTION&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 行动的负面潜在后果。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!NOTE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; 自定义标题&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 这是一个带有自定义标题的示例。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2. Obsidian 主题风格&lt;a href=&quot;#2-obsidian-主题风格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;a href=&quot;https://obsidian.md/&quot; target=&quot;_blank&quot;&gt;Obsidian&lt;/a&gt; 风格支持非常丰富的类型和别名。&lt;/p&gt;
点击展开 Obsidian 语法列表&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!NOTE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; NOTE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 通用的笔记块。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!ABSTRACT&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; ABSTRACT&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 文章的摘要。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!SUMMARY&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; SUMMARY&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 文章的总结（同 Abstract）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!TLDR&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; TLDR&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 太长不看（同 Abstract）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!INFO&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; INFO&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 提供额外信息。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!TODO&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; TODO&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 需要完成的事项。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!TIP&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; TIP&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 实用技巧或提示。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!HINT&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; HINT&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 暗示（同 Tip）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;24&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;25&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!IMPORTANT&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; IMPORTANT&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;26&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 重要信息（Obsidian 风格通常使用类似的图标）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;27&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;28&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!SUCCESS&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; SUCCESS&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;29&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 操作成功。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;30&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;31&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!CHECK&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; CHECK&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;32&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 检查通过（同 Success）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;33&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;34&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!DONE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; DONE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;35&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 已完成（同 Success）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;36&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;37&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!QUESTION&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; QUESTION&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;38&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 提出问题。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;39&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;40&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!HELP&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; HELP&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;41&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 寻求帮助（同 Question）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;42&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;43&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!FAQ&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; FAQ&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;44&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 常见问题（同 Question）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;45&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;46&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!WARNING&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; WARNING&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;47&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 警告信息。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;48&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;49&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!CAUTION&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; CAUTION&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;50&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 注意事项（同 Warning）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;51&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;52&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!ATTENTION&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; ATTENTION&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;53&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 引起注意（同 Warning）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;54&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;55&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!FAILURE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; FAILURE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;56&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 操作失败。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;57&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;58&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!FAIL&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; FAIL&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;59&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 失败（同 Failure）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;60&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;61&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!MISSING&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; MISSING&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;62&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 缺失内容（同 Failure）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;63&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;64&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!DANGER&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; DANGER&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;65&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 危险操作警告。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;66&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;67&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!ERROR&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; ERROR&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;68&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 错误信息（同 Danger）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;69&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;70&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!BUG&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; BUG&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;71&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 报告软件缺陷。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;72&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;73&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!EXAMPLE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; EXAMPLE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;74&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 展示一个例子。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;75&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;76&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!QUOTE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; QUOTE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;77&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 引用一段话。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;78&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;79&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!CITE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; CITE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;80&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 引证（同 Quote）。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;81&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;82&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!NOTE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; 自定义标题&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;83&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 这是一个带有自定义标题的示例。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;Obsidian&quot; loading=&quot;lazy&quot; width=&quot;2144&quot; height=&quot;1320&quot; src=&quot;/_astro/obsidian.Cwb2iYzd_1I7Wom.webp&quot; srcset=&quot;/_astro/obsidian.Cwb2iYzd_Ef4jX.webp 640w, /_astro/obsidian.Cwb2iYzd_Z21Lznp.webp 750w, /_astro/obsidian.Cwb2iYzd_2fRye1.webp 828w, /_astro/obsidian.Cwb2iYzd_1T2EQt.webp 1080w, /_astro/obsidian.Cwb2iYzd_17K54.webp 1280w, /_astro/obsidian.Cwb2iYzd_14jgEg.webp 1668w, /_astro/obsidian.Cwb2iYzd_TyKGG.webp 2048w, /_astro/obsidian.Cwb2iYzd_1I7Wom.webp 2144w&quot; /&gt;&lt;figcaption&gt;Obsidian&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;3. VitePress 主题风格&lt;a href=&quot;#3-vitepress-主题风格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;a href=&quot;https://vitepress.dev/&quot; target=&quot;_blank&quot;&gt;VitePress&lt;/a&gt; 风格提供了一套现代化的、扁平的默认样式。目前仅包含与 GitHub 一致的 &lt;strong&gt;5 种&lt;/strong&gt; 基础类型。&lt;/p&gt;
点击展开 VitePress 语法列表&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!NOTE&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; NOTE&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 对应 GitHub 的 Note。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!TIP&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; TIP&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 对应 GitHub 的 Tip。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!IMPORTANT&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; IMPORTANT&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 对应 GitHub 的 Important。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!WARNING&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; WARNING&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 对应 GitHub 的 Warning。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!CAUTION&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; CAUTION&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 对应 GitHub 的 Caution。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;!TIP&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt; 自定义标题&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; VitePress 风格同样支持自定义标题。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img alt=&quot;VitePress&quot; loading=&quot;lazy&quot; width=&quot;2144&quot; height=&quot;1318&quot; src=&quot;/_astro/vitepress.D2YnjBWE_Z1rUl1H.webp&quot; srcset=&quot;/_astro/vitepress.D2YnjBWE_a8rfo.webp 640w, /_astro/vitepress.D2YnjBWE_1dRCyH.webp 750w, /_astro/vitepress.D2YnjBWE_25m85l.webp 828w, /_astro/vitepress.D2YnjBWE_ZhpWJ1.webp 1080w, /_astro/vitepress.D2YnjBWE_j03hn.webp 1280w, /_astro/vitepress.D2YnjBWE_Z1AHxbA.webp 1668w, /_astro/vitepress.D2YnjBWE_ZkwCfV.webp 2048w, /_astro/vitepress.D2YnjBWE_Z1rUl1H.webp 2144w&quot; /&gt;&lt;figcaption&gt;VitePress&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;4. Docusaurus 风格语法&lt;a href=&quot;#4-docusaurus-风格语法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;仅支持语法，风格保持跟上面三个主题相同。&lt;/p&gt;
点击展开 Docusaurus 语法列表 &lt;p&gt;支持以下类型的提醒框：&lt;code&gt;note&lt;/code&gt; &lt;code&gt;tip&lt;/code&gt; &lt;code&gt;important&lt;/code&gt; &lt;code&gt;warning&lt;/code&gt; &lt;code&gt;caution&lt;/code&gt;&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::note&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;突出显示用户应该考虑的信息，即使在快速浏览时也是如此。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::tip&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;可选信息，帮助用户更成功。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::important&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;用户成功所必需的关键信息。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::warning&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;14&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;由于潜在风险需要用户立即注意的关键内容。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;15&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;16&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;17&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::caution&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;18&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;行动的负面潜在后果。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;19&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;20&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;21&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::tip&lt;/span&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;自定义标题&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;22&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;可选信息，帮助用户更成功。&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;23&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;:::&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;span&gt;展开&lt;/span&gt;&lt;span&gt;收起&lt;/span&gt;&lt;/div&gt;&lt;/div&gt; &lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;剧透&lt;a href=&quot;#剧透&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;您可以为文本添加剧透。文本也支持 &lt;strong&gt;Markdown&lt;/strong&gt; 语法。&lt;/p&gt;&lt;p&gt;内容 被隐藏了 &lt;strong&gt;哈哈&lt;/strong&gt;！&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;内容 :spoiler[被隐藏了 &lt;/span&gt;&lt;span&gt;**哈哈**&lt;/span&gt;&lt;span&gt;]！&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;图片画廊网格 (Image Grid)&lt;a href=&quot;#图片画廊网格-image-grid&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;您可以使用 &lt;code&gt;[grid]&lt;/code&gt; 和 &lt;code&gt;[/grid]&lt;/code&gt; 标签将多张图片纵向并排展示。这对于展示照片画廊或对比图非常有用。系统会自动根据包裹在其中的图片数量（最多支持并排展示4张）以响应式网格进行布局。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;自动补齐图片高度：&lt;/strong&gt; 同一排中如果有高度、大小或者比例不一的图片，会像「九宫格画廊相册」一样自动撑满。较短或不协调的图片会自动使用 object-cover 进行完美中心裁剪补充视野。图片边框水平彻底对齐无缝隙，但被裁剪后，只有点击图片通过灯箱才能查看完整图片，所以建议尽量避免使用长宽比例不一致的图片在同一排中。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;图注恒定底端对齐：&lt;/strong&gt; 不论上面的图片长宽如何变化，在同一行的所有图像解释文字（图注）都会对标到一条完美的水平基线上了。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;img alt=&quot;示例图片一&quot; loading=&quot;lazy&quot; width=&quot;3328&quot; height=&quot;1872&quot; src=&quot;/_astro/firefly1.CZCuCN4V_1dgNYg.webp&quot; srcset=&quot;/_astro/firefly1.CZCuCN4V_Z1oImC9.webp 640w, /_astro/firefly1.CZCuCN4V_1i57aM.webp 750w, /_astro/firefly1.CZCuCN4V_3bOMV.webp 828w, /_astro/firefly1.CZCuCN4V_ZFy9e2.webp 1080w, /_astro/firefly1.CZCuCN4V_TW7id.webp 1280w, /_astro/firefly1.CZCuCN4V_GbVq.webp 1668w, /_astro/firefly1.CZCuCN4V_MiHUH.webp 2048w, /_astro/firefly1.CZCuCN4V_FJNnX.webp 2560w, /_astro/firefly1.CZCuCN4V_1dgNYg.webp 3328w&quot; /&gt;&lt;figcaption&gt;示例图片一&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;示例图片二&quot; loading=&quot;lazy&quot; width=&quot;4096&quot; height=&quot;2212&quot; src=&quot;/_astro/firefly2.dxmXG905_ZyJm5m.webp&quot; srcset=&quot;/_astro/firefly2.dxmXG905_VG1L6.webp 640w, /_astro/firefly2.dxmXG905_ZgGmKx.webp 750w, /_astro/firefly2.dxmXG905_Z2qDwK8.webp 828w, /_astro/firefly2.dxmXG905_Z1AO6EE.webp 1080w, /_astro/firefly2.dxmXG905_2m5ePB.webp 1280w, /_astro/firefly2.dxmXG905_mURyM.webp 1668w, /_astro/firefly2.dxmXG905_ZIlkOV.webp 2048w, /_astro/firefly2.dxmXG905_Z28Akm.webp 2560w, /_astro/firefly2.dxmXG905_ZyJm5m.webp 4096w&quot; /&gt;&lt;figcaption&gt;示例图片二&lt;/figcaption&gt;&lt;/figure&gt;&lt;figure&gt;&lt;img alt=&quot;示例图片二&quot; loading=&quot;lazy&quot; width=&quot;3840&quot; height=&quot;2160&quot; src=&quot;/_astro/firefly3.CGzFXcxi_Z1Lz6q8.webp&quot; srcset=&quot;/_astro/firefly3.CGzFXcxi_ZmVxR3.webp 640w, /_astro/firefly3.CGzFXcxi_2jQUUS.webp 750w, /_astro/firefly3.CGzFXcxi_14XDy2.webp 828w, /_astro/firefly3.CGzFXcxi_Hxghp.webp 1080w, /_astro/firefly3.CGzFXcxi_2j3wNE.webp 1280w, /_astro/firefly3.CGzFXcxi_1oMBrR.webp 1668w, /_astro/firefly3.CGzFXcxi_2bp8r9.webp 2048w, /_astro/firefly3.CGzFXcxi_24QdTp.webp 2560w, /_astro/firefly3.CGzFXcxi_Z1Lz6q8.webp 3840w&quot; /&gt;&lt;figcaption&gt;示例图片二&lt;/figcaption&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;&lt;strong&gt;基本语法&lt;/strong&gt;&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;grid&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![&lt;/span&gt;&lt;span&gt;示例图片一&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;./images/firefly1.avif&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![&lt;/span&gt;&lt;span&gt;示例图片二&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;./images/firefly2.avif&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![&lt;/span&gt;&lt;span&gt;示例图片二&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;./images/firefly3.avif&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[&lt;/span&gt;&lt;span&gt;/grid&lt;/span&gt;&lt;span&gt;]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;</content:encoded></item><item><title>Markdown Mermaid 图表</title><link>https://firefly.cuteleaf.cn/posts/markdown-mermaid/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/markdown-mermaid/</guid><description>一个包含 Mermaid 的 Markdown 博客文章简单示例。</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;Markdown 中 Mermaid 图表完整指南&lt;a href=&quot;#markdown-中-mermaid-图表完整指南&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;本文演示如何在 Markdown 文档中使用 Mermaid 创建各种复杂图表，包括流程图、时序图、甘特图、类图和状态图。&lt;/p&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;流程图示例&lt;a href=&quot;#流程图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;流程图非常适合表示流程或算法步骤。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;是&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;否&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子过程详情&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;开始&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;条件检查&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;另一个决策&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结束&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;是&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;否&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子过程详情&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;开始&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;条件检查&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;另一个决策&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结束&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;时序图示例&lt;a href=&quot;#时序图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;时序图显示对象之间随时间的交互。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;数据库服务器网页应用用户数据库服务器网页应用用户alt[认证成功][认证失败]提交登录请求发送认证请求查询用户凭据返回用户数据返回认证结果显示欢迎页面请求用户数据获取用户偏好返回偏好设置返回用户数据加载个性化界面显示错误消息提示重新输入
&lt;/div&gt;&lt;div&gt;数据库服务器网页应用用户数据库服务器网页应用用户alt[认证成功][认证失败]提交登录请求发送认证请求查询用户凭据返回用户数据返回认证结果显示欢迎页面请求用户数据获取用户偏好返回偏好设置返回用户数据加载个性化界面显示错误消息提示重新输入
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;甘特图示例&lt;a href=&quot;#甘特图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;甘特图非常适合显示项目进度和时间线。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt; 10/01 10/08 10/15 10/22 10/29 11/05 11/12 11/19需求分析      UI设计                 数据库设计           原型创建        后端开发       前端开发      单元测试              集成测试       用户验收测试   生产环境部署     发布                    设计阶段开发阶段测试阶段部署网站开发项目时间线
&lt;/div&gt;&lt;div&gt; 10/01 10/08 10/15 10/22 10/29 11/05 11/12 11/19需求分析      UI设计                 数据库设计           原型创建        后端开发       前端开发      单元测试              集成测试       用户验收测试   生产环境部署     发布                    设计阶段开发阶段测试阶段部署网站开发项目时间线
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;类图示例&lt;a href=&quot;#类图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;类图显示系统的静态结构，包括类、属性、方法及其关系。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;写作&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发表&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拥有&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;属于&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;User&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String username&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String password&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String email&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean active&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+login()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+logout()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+updateProfile()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Article&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String title&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date publishDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean published&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+publish()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+edit()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+delete()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Comment&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date commentDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+deleteComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Category&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String name&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String description&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+removeArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;写作&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发表&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拥有&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;属于&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;User&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String username&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String password&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String email&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean active&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+login()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+logout()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+updateProfile()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Article&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String title&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date publishDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean published&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+publish()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+edit()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+delete()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Comment&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date commentDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+deleteComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Category&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String name&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String description&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+removeArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;状态图示例&lt;a href=&quot;#状态图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;状态图显示对象在其生命周期中经历的状态序列。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;提交&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拒绝&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发布&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;撤回&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;草稿&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;审核中&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;已发布&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;临时隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;恢复&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;活跃&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;提交&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拒绝&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发布&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;撤回&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;草稿&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;审核中&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;已发布&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;临时隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;恢复&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;活跃&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;饼图示例&lt;a href=&quot;#饼图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;饼图非常适合显示比例和百分比数据。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;46%30%15%6%3%网站流量来源分析搜索引擎直接访问社交媒体推荐链接其他来源
&lt;/div&gt;&lt;div&gt;46%30%15%6%3%网站流量来源分析搜索引擎直接访问社交媒体推荐链接其他来源
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;总结&lt;a href=&quot;#总结&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Mermaid 是在 Markdown 文档中创建各种类型图表的强大工具。本文演示了如何使用流程图、时序图、甘特图、类图、状态图和饼图。这些图表可以帮助您更清晰地表达复杂的概念、流程和数据结构。&lt;/p&gt;&lt;p&gt;要使用 Mermaid，只需在代码块中指定 mermaid 语言，并使用简洁的文本语法描述图表。Mermaid 会自动将这些描述转换为美观的可视化图表。&lt;/p&gt;&lt;p&gt;尝试在您的下一篇技术博客文章或项目文档中使用 Mermaid 图表 - 它们将使您的内容更加专业且更易理解！&lt;/p&gt;&lt;/section&gt;</content:encoded></item><item><title>Markdown PlantUML 图表</title><link>https://firefly.cuteleaf.cn/posts/markdown-plantuml/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/markdown-plantuml/</guid><description>用于验证 Firefly 中 PlantUML 插件渲染、主题切换与交互能力的示例文章。</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;Markdown 中 PlantUML 图表指南&lt;a href=&quot;#markdown-中-plantuml-图表指南&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;PlantUML 是一种使用纯文本描述图表的工具。你只需要写一段结构化语法，就可以生成时序图、类图、用例图、活动图等常见工程图。&lt;/p&gt;&lt;p&gt;它特别适合写在技术博客和项目文档里：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;图表和正文一起版本管理，便于协作与审阅&lt;/li&gt;
&lt;li&gt;修改图只需要改文本，适合频繁迭代&lt;/li&gt;
&lt;li&gt;能和 Markdown 无缝结合，保持文档统一&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;在 Firefly 中，&lt;code&gt;plantuml&lt;/code&gt; 代码块会在构建阶段编码并生成服务器 SVG 地址，页面端再根据亮暗主题自动切换图源，并支持缩放、拖拽和全屏交互。&lt;/p&gt;&lt;p&gt;如果你想快速上手，可以记住这个最小模板：&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
Alice -&amp;gt; Bob: Hello
Bob --&amp;gt; Alice: Hi
@enduml&quot; src=&quot;https://www.plantuml.com/plantuml/svg/SoWkIImgAStDuNBCoKnELT2rKt3AJx9Iy4ZDoSddSifFKj3LjLC0orafU6HoEQJcfPJcvW00&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;活动图示例&lt;a href=&quot;#活动图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
start
:用户提交订单;
if (库存充足?) then (是)
	:冻结库存;
	:创建支付单;
	if (支付成功?) then (是)
		:生成发货单;
		:通知仓库拣货;
	else (否)
		:取消订单;
		:释放库存;
	endif
else (否)
	:提示缺货;
endif
stop
@enduml&quot; src=&quot;https://www.plantuml.com/plantuml/svg/NOuz2i9048NhtLEaZ5VO57eLmHM56CN4taODYYHYbA15mFz6BHI5ZNYQp6oyXMI38dRpcFTzl9BjbDjEfs5ITL0cWmEwT_JyH6pIqmh6CuFMgveEOWh747gzz7Of5ZIdnYrDn_1Se8H1FvRnD6yOMNQN40iCpaaSAW7937b6ruTXz6SWJ0PHzl4cwNMV8uIzkWiPRHDbnj4wlUuDIhXfSqq7VwSmyEPuSpyxCsOmnE3vdSAjIhrAVnc6dYytGZw4ykK5sscsQ8bRbKx3V0C0&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;状态图示例&lt;a href=&quot;#状态图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
[*] --&amp;gt; 草稿

草稿 --&amp;gt; 待审核 : 提交
待审核 --&amp;gt; 草稿 : 驳回
待审核 --&amp;gt; 已发布 : 审核通过
已发布 --&amp;gt; 已归档 : 到期归档
已发布 --&amp;gt; 草稿 : 撤回修改

state 已发布 {
	[*] --&amp;gt; 可见
	可见 --&amp;gt; 隐藏 : 手动隐藏
	隐藏 --&amp;gt; 可见 : 恢复展示
}

已归档 --&amp;gt; [*]
@enduml&quot; src=&quot;https://www.plantuml.com/plantuml/svg/SoWkIImgAStDuOhMYbNGrRLJUD7R-Np5VYuk20qMUhglzUcwXSyMx52mKdZMF-79hYLS22647WKhXPShDp-TFGzDzkdsJK_x9pxTqQnWfG0HVjamwyN-TYw414pPtadF5Yu6AUlOy6pEV0WNJHdShcUJbZoTFU_9_dNFfkpauYekIIn9HRAgceiJvgEd_UjVB6_aueJGOA6NioQycDuFCgIp-sdN2WYNYnCgZD04Kj6uwEcItgSRfpvViekhbeiBuKoGicYjM2w7rBoKqjmS0000&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;用例图示例&lt;a href=&quot;#用例图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
left to right direction
actor 游客
actor 用户
actor 管理员

rectangle 博客系统 {
	usecase &amp;quot;浏览文章&amp;quot; as UC1
	usecase &amp;quot;搜索内容&amp;quot; as UC2
	usecase &amp;quot;发表评论&amp;quot; as UC3
	usecase &amp;quot;点赞收藏&amp;quot; as UC4
	usecase &amp;quot;审核评论&amp;quot; as UC5
	usec&quot; src=&quot;https://www.plantuml.com/plantuml/svg/PP3BJi9058RNdASuOSz2Raj3uZFm09CoOfFI9krqPTm88XjJI8WQGv1s8ud9i02qoFFCvJ6CCf8EBh_pvJyvvsz5Z8GixddWqKk6BC3GxLunxBWXTPWR-40S5eGeyrpmp82QBkNeymzugiP3CNa6-8aGl-jH50ylWcTglLVxLxo6KXnHXqGKotARwBUHVBnNxuioaWZR5sT5FPwfJIQ6TuBlZAuMj4WcEbtgrK3pBwDh1QrkTtexbzCF_PGONI-cUIeNkPLksCj5thTEQy8DmE5rh5JEVu-ri0g7BexMmXDRix4En-hCfF5lqeGMzJjnp_i6&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;组件图示例&lt;a href=&quot;#组件图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
package &amp;quot;Firefly Site&amp;quot; {
	[Astro App] as App
	[Markdown Parser] as Parser
	[PlantUML Encoder] as Encoder
	[Theme Switcher] as Theme
	[Search Indexer] as Search
}

cloud &amp;quot;PlantUML Server&amp;quot; as &quot; src=&quot;https://www.plantuml.com/plantuml/svg/JL51QiCm43nxNp7u7dht8IIK5WeD15oVJ0-oj8sDPKcLvAIbzEz5YX9wqZ2pxCoiTY4A7zT5anDo5YT6_Jnv_j3VQAV8DNwewlSXUekzS-yG8RrKzGVXPsKl1aVX0_kiN25L_L4B4xl3AvwCjAge1LFLlusyCDhB5ELOn4nHrRSil1pnOXH_5UbAqI-Hr7PLgE_RM_PdzdMsxaY9A0OH6FMZDP5DH1kjvomNXcZl73QRROcA1Yu1BAKD5JwDbBnem1d19TzrqHYqbNEWsq3Urw61vy-LGqGud-v6rwuDGcuB9VpyeAVJ616yl4-LsWs6TT8ABdt4b6xmFz2jLZ8I2iw666Z7HgsB_WC0&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;部署图示例&lt;a href=&quot;#部署图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
node &amp;quot;User Device&amp;quot; {
	artifact &amp;quot;Browser&amp;quot;
}

node &amp;quot;CDN / Edge&amp;quot; {
	artifact &amp;quot;Static Assets&amp;quot;
}

node &amp;quot;Cloudflare Worker&amp;quot; {
	artifact &amp;quot;SSR Handler&amp;quot;
}

node &amp;quot;PlantUML Service&amp;quot; {
	artifact &amp;quot;SVG Re&quot; src=&quot;https://www.plantuml.com/plantuml/svg/ROz1Jy9044RFxg_uqZlfdOD1WS11r53Hyz2TraAxYpDJE1Z_kqb3J6azxtkpxvkfaLZRr2v4pqXsoe85dwkS4toxEnAh2ieDoQF4Yx8axiTTsVdY6IcMlXoYcP5LEHvKsRGlrB7rHKt2-8XoP1bwsHPh2hw--UQrfc2xpHCobd-wilSLjXmyozNoPBGdPIGl-mFdXioYq2XoGtBqyH8mZy4uMEV-hSHaSZySWYbMopSSDCrLqwefHtYl7rC8VxMiXXELx6uVEtnKq3daSOfgezlzcPYYOCi_uIigXHhekNGp3hvjwby0&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;ER 图示例&lt;a href=&quot;#er-图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
entity User {
	*id : uuid &amp;lt;&amp;lt;PK&amp;gt;&amp;gt;
	--
	username : varchar
	email : varchar
	created_at : datetime
}

entity Post {
	*id : uuid &amp;lt;&amp;lt;PK&amp;gt;&amp;gt;
	--
	author_id : uuid &amp;lt;&amp;lt;FK&amp;gt;&amp;gt;
	title : varchar
	content : &quot; src=&quot;https://www.plantuml.com/plantuml/svg/VP2x2W9134NhoLUa5lO71X51iB6niPRiJc07vY6JZ0_KVvTTKHGVRKwIavkvA1MjCG0dzNh2ZN31CvY9TsYnLkzmEbslPZCmJGEc2fT4aT7YdahNKm73aNnuBNI5ITbjIT6Y8sNraU4A3ySwY_vnKDK-b-qhN8vGlOOtSvUJSXeioaS5iwjjyDB_KIzoZCF4R_ikYtvn3y6_bDliJa_zpzpZKo-NfiddUtYBX-ALvOqyRhDuNoGmzdxGdWJcd5oDuGO0&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;时序图示例（登录与刷新令牌）&lt;a href=&quot;#时序图示例登录与刷新令牌&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
autonumber
actor User as 用户
participant Web as 前端页面
participant API as 网关接口
participant Auth as 认证服务
database Redis as 会话缓存

用户 -&amp;gt; 前端页面 : 输入账号密码并提交
前端页面 -&amp;gt; 网关接口 : POST /login
网关接口 -&amp;gt; 认证服务 : &quot; src=&quot;https://www.plantuml.com/plantuml/svg/bP3BJi9068NtynJ_thGIbrqqk7GbyHANPYYZ4A4bxVG1M70D5GrAn42u2CPee2HUY0BwCioql8L1t0ma1jVVEJFVVu8MnIQr4t64RMheTY9CJ8GrQfXmQ14Ji0NUrGFF3L4IcpIcnP9Oft14mdF2yextvCvQhxDwM-3RePsVvkIIfP_vUPULxaHkq-WyuFSxlflYDOSLMYY2AGvZYy0UYSIiEPwERtstxetBh7U3qC8395Nu5nJmFyiitVLVxbbfoDoCrqonzpTUkfX-T90GbLH12HG8xUuVm6RSE8tfI42IAiY10hpPcZqMMRR7dJuIcAGAfg00orHPkWicEJ695JscnXdHbpghBbZJY6Kjmh2nL1RbLZVO2WJ0guxOv9hdBbYXWP0io-AJ_bUMrneWop9QRvPVW_M6-VFObO7yIPyxxNyEn2i3uQArHk6LmNJKyV9552Hwn4x4lm40&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;C4 风格容器图示例&lt;a href=&quot;#c4-风格容器图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;div&gt;&lt;div&gt;&lt;img alt=&quot;@startuml
!includeurl https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml

Person(user, &amp;quot;博客访客&amp;quot;, &amp;quot;阅读文章与搜索内容&amp;quot;)

System_Boundary(system, &amp;quot;Firefly Blog&amp;quot;) {
	Container(we&quot; src=&quot;https://www.plantuml.com/plantuml/svg/PL7BJjj055tNNp7robP3l67L5I7b9GKHnQ6egyYE9udBn8x6Oq9KLQeeeLMbGDHIYWfL6fTAIAXs7w2cGOAVoTZENrHZfsaYTZFtddlkkUVCMKJ1nAuYxhvk596jGHiZK26aPZsK9ApKasMTL6pLjY0kcWQ11aaMpQfKGuh1ncOieY5TbTApCrbMMb_DI5N58X1BwTb2sZI8eXiG9sji1PU5s38DWP4b04zR7wdhXEujTHq-0VZXSJFqhlsZLy75vq5lts-V1fSEtMjIzmylSfpSi0Yi5kPDsz0Kt12iw9y0_AAEOGarm3mooxm8dd7tndk5EbGJWD-0AaZLQcn9oYBO10-0l0KHWQpYztxwdNV3xjNmapFexG_wPuF-MrwSOZ7nPYHPbdDW8_gmoJGoRQs450n7HOjLwTbkqDxpJrlqJJUuy6BwqFlj_zYPOdsa2YD76LNy0Z8nSQHgLS6RcbatW0JMrAUm6BUKSjIatuxfpldOgV1gr--tQVEb__wxttAdjLjGmSKAqnuzm8gXmMr6abNAiAGRMkJ1GNjmSqARZDF_yYAuT7YHUpxsV66R2FyIPvEZf84CyLPiHN3OyL-tWVnu2T2Jcx1xpXBBGJJAEeuXT6-77rm6Nyxdip8lHeYeDtOuDWeme-D8xi17oF_UXTurFJYAtPZa75_kTxw6daERluQ7RkYr9Z4JLyMRO_Ni47P19lLaRJrVo2mivWkvbQNbl21oSz3Gx2hw2m00&quot; loading=&quot;lazy&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;</content:encoded></item><item><title>Markdown 教程</title><link>https://firefly.cuteleaf.cn/posts/markdown-tutorial/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/markdown-tutorial/</guid><description>一个简明的 Markdown 博客示例。</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;这是一个展示如何编写 Markdown 文件的示例。本文档汇总了核心语法与常见扩展（GFM）。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#block-elements&quot;&gt;块级元素&lt;/a&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#paragraphs-and-line-breaks&quot;&gt;段落与换行&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#headers&quot;&gt;标题&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#blockquotes&quot;&gt;引用&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#lists&quot;&gt;列表&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#code-blocks&quot;&gt;代码块&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#horizontal-rules&quot;&gt;分割线&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#table&quot;&gt;表格&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#span-elements&quot;&gt;内联元素&lt;/a&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#links&quot;&gt;链接&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#emphasis&quot;&gt;强调&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#code&quot;&gt;行内代码&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#images&quot;&gt;图片&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#strikethrough&quot;&gt;删除线&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#miscellaneous&quot;&gt;杂项&lt;/a&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#automatic-links&quot;&gt;自动链接&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#backslash-escapes&quot;&gt;反斜杠转义&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#inline-html&quot;&gt;内联 HTML&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;
&lt;section&gt;&lt;h2&gt;块级元素&lt;a href=&quot;#块级元素&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;段落与换行&lt;a href=&quot;#段落与换行&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;段落&lt;a href=&quot;#段落&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;p&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;使用一个或多个空行分隔段落。（仅包含&lt;strong&gt;空格&lt;/strong&gt;或&lt;strong&gt;制表符&lt;/strong&gt;的行也视为空行。）&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This will be&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;inline.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is second paragraph.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This will be
inline.&lt;/p&gt;&lt;p&gt;This is second paragraph.&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;换行&lt;a href=&quot;#换行&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;br /&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;在行末添加&lt;strong&gt;两个或更多空格&lt;/strong&gt;来产生换行。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This will be not&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;inline.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This will be not&lt;br /&gt;
inline.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;标题&lt;a href=&quot;#标题&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 支持两种标题样式：Setext 与 atx。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;Setext&lt;a href=&quot;#setext&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;使用&lt;strong&gt;等号 (=)&lt;/strong&gt; 表示 &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;、使用&lt;strong&gt;短横线 (-)&lt;/strong&gt; 表示 &lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;，数量不限，作为“下划线”。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is an H1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;=============&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is an H2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-------------&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;This is an H1&lt;a href=&quot;#this-is-an-h1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;This is an H2&lt;a href=&quot;#this-is-an-h2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;hr /&gt;&lt;section&gt;&lt;h4&gt;atx&lt;a href=&quot;#atx&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h3&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h4&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h5&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h6&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;在行首使用 1-6 个&lt;strong&gt;井号 (#)&lt;/strong&gt;，对应 &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt; 至 &lt;code&gt;&amp;lt;h6&amp;gt;&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# This is an H1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;## This is an H2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;###### This is an H6&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;This is an H1&lt;a href=&quot;#this-is-an-h1-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;This is an H2&lt;a href=&quot;#this-is-an-h2-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h6&gt;This is an H6&lt;a href=&quot;#this-is-an-h6&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h6&gt;&lt;hr /&gt;&lt;p&gt;可选：你可以在行尾“闭合” atx 标题。末尾的井号数量&lt;strong&gt;不必与&lt;/strong&gt;开头一致。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# This is an H1 #&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;## This is an H2 ##&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;### This is an H3 ######&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;This is an H1&lt;a href=&quot;#this-is-an-h1-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;This is an H2&lt;a href=&quot;#this-is-an-h2-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;This is an H3&lt;a href=&quot;#this-is-an-h3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;引用&lt;a href=&quot;#引用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 使用邮件风格的 &lt;strong&gt;&amp;gt;&lt;/strong&gt; 作为引用符号。若手动换行并在每行前加 &amp;gt;，显示效果最佳。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; id sem consectetuer libero luctus adipiscing.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;p&gt;This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/p&gt;&lt;p&gt;Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
id sem consectetuer libero luctus adipiscing.&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;Markdown 允许“偷懒”：在一个硬换行段落中，只在第一行前加 &amp;gt; 即可。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;id sem consectetuer libero luctus adipiscing.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;p&gt;This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/p&gt;&lt;/blockquote&gt;&lt;blockquote&gt;&lt;p&gt;Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
id sem consectetuer libero luctus adipiscing.&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;引用可以嵌套（引用中的引用），通过增加 &amp;gt; 层级实现。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; This is the first level of quoting.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &amp;gt; This is nested blockquote.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Back to the first level.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;p&gt;This is the first level of quoting.&lt;/p&gt;&lt;blockquote&gt;&lt;p&gt;This is nested blockquote.&lt;/p&gt;&lt;/blockquote&gt;&lt;p&gt;Back to the first level.&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;引用内可包含其他 Markdown 元素，包括标题、列表与代码块。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; ## This is a header.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 1.   This is the first list item.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 2.   This is the second list item.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Here&apos;s some example code:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;     return shell_exec(&quot;echo $input | $markdown_script&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;h2&gt;This is a header.&lt;a href=&quot;#this-is-a-header&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;This is the first list item.&lt;/li&gt;
&lt;li&gt;This is the second list item.&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;Here’s some example code:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;return shell_exec(&quot;echo $input | $markdown_script&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;列表&lt;a href=&quot;#列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 支持有序（数字）与无序（圆点）列表。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;无序列表&lt;a href=&quot;#无序列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;ul&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;无序列表可使用 &lt;strong&gt;星号 (*)&lt;/strong&gt;、&lt;strong&gt;加号 (+)&lt;/strong&gt; 或 &lt;strong&gt;短横线 (-)&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   Red&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   Green&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   Blue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;Red&lt;/li&gt;
&lt;li&gt;Green&lt;/li&gt;
&lt;li&gt;Blue&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;p&gt;等价于：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   Red&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   Green&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   Blue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;或者：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   Red&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   Green&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   Blue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;有序列表&lt;a href=&quot;#有序列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;ol&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;有序列表使用数字加英文句点：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;1.  Bird&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;2.  McHale&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;3.  Parish&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ol&gt;
&lt;li&gt;Bird&lt;/li&gt;
&lt;li&gt;McHale&lt;/li&gt;
&lt;li&gt;Parish&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;p&gt;注意：像下面这样可能会“意外触发”有序列表：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;1986. What a great season.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ol&gt;
&lt;li&gt;What a great season.&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;p&gt;你可以用&lt;strong&gt;反斜杠转义 (\)&lt;/strong&gt; 句点：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;1986\. What a great season.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;1986. What a great season.&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;列表中的缩进内容&lt;a href=&quot;#列表中的缩进内容&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;section&gt;&lt;h5&gt;列表项里的引用&lt;a href=&quot;#列表项里的引用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h5&gt;&lt;p&gt;在列表项内放置引用，需要将 &amp;gt; 符号整体缩进：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   A list item with a blockquote:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;gt; This is a blockquote&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;gt; inside a list item.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;A list item with a blockquote:&lt;/p&gt;
&lt;blockquote&gt;&lt;p&gt;This is a blockquote
inside a list item.&lt;/p&gt;&lt;/blockquote&gt;
&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h5&gt;列表项里的代码块&lt;a href=&quot;#列表项里的代码块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h5&gt;&lt;p&gt;在列表项内放置代码块，需要缩进两层——&lt;strong&gt;8 个空格&lt;/strong&gt;或&lt;strong&gt;两个 Tab&lt;/strong&gt;：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   A list item with a code block:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;code goes here&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;A list item with a code block:&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;code goes here&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h5&gt;嵌套列表&lt;a href=&quot;#嵌套列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h5&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* A&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* A1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* A2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* B&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* C&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;A
&lt;ul&gt;
&lt;li&gt;A1&lt;/li&gt;
&lt;li&gt;A2&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;B&lt;/li&gt;
&lt;li&gt;C&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;代码块&lt;a href=&quot;#代码块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;pre&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;将代码块中的每行缩进至少&lt;strong&gt;4 个空格&lt;/strong&gt;或&lt;strong&gt;1 个制表符&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is a normal paragraph:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;This is a code block.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is a normal paragraph:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is a code block.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;p&gt;代码块会一直持续，直到遇到未缩进的行（或文末）。&lt;/p&gt;&lt;p&gt;在代码块内，&lt;strong&gt;与号 (&amp;amp;)&lt;/strong&gt; 和尖括号 &lt;strong&gt;(&amp;lt; &amp;gt;)&lt;/strong&gt; 会自动转为 HTML 实体。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;div class=&quot;footer&quot;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;amp;copy; 2004 Foo Corporation&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;div class=&quot;footer&quot;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;amp;copy; 2004 Foo Corporation&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;p&gt;下文的“围栏代码块”和“语法高亮”属于扩展语法，你也可以用它们来书写代码块。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;围栏代码块&lt;a href=&quot;#围栏代码块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;使用成对的反引号围起来（如下所示），就不需要四空格缩进了。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Here&apos;s an example:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function test() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console.log(&quot;notice the blank line before this function?&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Here’s an example:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function test() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console.log(&quot;notice the blank line before this function?&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;语法高亮&lt;a href=&quot;#语法高亮&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;在围栏代码块后添加可选的语言标识，即可启用语法高亮（参见支持语言列表）。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```ruby&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;require &apos;redcarpet&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;markdown = Redcarpet.new(&quot;Hello World!&quot;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;puts markdown.to_html&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;require &lt;/span&gt;&lt;span&gt;&apos;redcarpet&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;markdown&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;Redcarpet&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;new&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&quot;Hello World!&quot;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;puts&lt;/span&gt;&lt;span&gt; markdown.&lt;/span&gt;&lt;span&gt;to_html&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;分割线（水平线）&lt;a href=&quot;#分割线水平线&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;hr /&amp;gt;&lt;/code&gt;
一行中放置&lt;strong&gt;三个或以上的短横线 (-)、星号 (*) 或下划线 (_)&lt;/strong&gt;。符号之间允许有空格。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* * *&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;***&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*****&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- - -&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---------------------------------------&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;___&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;表格&lt;a href=&quot;#表格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;table&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;这是扩展语法。&lt;/p&gt;&lt;p&gt;用&lt;strong&gt;竖线 (|)&lt;/strong&gt; 分隔列，用&lt;strong&gt;短横线 (-)&lt;/strong&gt; 分隔表头，使用&lt;strong&gt;冒号 (:)&lt;/strong&gt; 指定对齐方式。&lt;/p&gt;&lt;p&gt;两侧的&lt;strong&gt;竖线 (|)&lt;/strong&gt; 与对齐可选。用于表头分隔时，每列至少需要 &lt;strong&gt;3 个短横线&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;| Left | Center | Right |&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;|:-----|:------:|------:|&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;|aaa   |bbb     |ccc    |&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;|ddd   |eee     |fff    |&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;A | B&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---|---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;123|456&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;A |B&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;--|--&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;12|45&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;



















&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;Left&lt;/th&gt;&lt;th&gt;Center&lt;/th&gt;&lt;th&gt;Right&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;aaa&lt;/td&gt;&lt;td&gt;bbb&lt;/td&gt;&lt;td&gt;ccc&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;ddd&lt;/td&gt;&lt;td&gt;eee&lt;/td&gt;&lt;td&gt;fff&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;












&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;A&lt;/th&gt;&lt;th&gt;B&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;123&lt;/td&gt;&lt;td&gt;456&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;












&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;A&lt;/th&gt;&lt;th&gt;B&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;12&lt;/td&gt;&lt;td&gt;45&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;内联元素&lt;a href=&quot;#内联元素&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;链接&lt;a href=&quot;#链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;a&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 支持两种链接样式：行内链接与引用式链接。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;行内链接&lt;a href=&quot;#行内链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;行内链接格式：&lt;code&gt;[文本](URL &quot;标题&quot;)&lt;/code&gt;&lt;/p&gt;&lt;p&gt;标题可选。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is [an example](http://example.com/ &quot;Title&quot;) inline link.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[This link](http://example.net/) has no title attribute.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is &lt;a href=&quot;http://example.com/&quot; target=&quot;_blank&quot;&gt;an example&lt;/a&gt; inline link.&lt;/p&gt;&lt;p&gt;&lt;a href=&quot;http://example.net/&quot; target=&quot;_blank&quot;&gt;This link&lt;/a&gt; has no title attribute.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;如果引用同一站点的本地资源，可以使用相对路径：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;See my [About](/about/) page for details.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;See my &lt;a href=&quot;/about/&quot;&gt;About&lt;/a&gt; page for details.&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;引用式链接&lt;a href=&quot;#引用式链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;可以预定义链接引用。定义格式：&lt;code&gt;[id]: URL &quot;标题&quot;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;标题同样可选。引用时使用：&lt;code&gt;[文本][id]&lt;/code&gt;&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[id]: http://example.com/  &quot;Optional Title Here&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is [an example][id] reference-style link.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is &lt;a href=&quot;http://example.com/&quot; target=&quot;_blank&quot;&gt;an example&lt;/a&gt; reference-style link.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;说明：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;方括号中包含链接标识（&lt;strong&gt;不区分大小写&lt;/strong&gt;，可在左侧缩进最多三格空格）；&lt;/li&gt;
&lt;li&gt;随后是冒号；&lt;/li&gt;
&lt;li&gt;再跟一个或多个空格（或 tab）；&lt;/li&gt;
&lt;li&gt;然后是链接 URL；&lt;/li&gt;
&lt;li&gt;URL 可选地用尖括号包裹；&lt;/li&gt;
&lt;li&gt;可选地跟随标题属性，用引号或圆括号包裹。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;以下三种定义等价：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: http://example.com/  &quot;Optional Title Here&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: http://example.com/  &apos;Optional Title Here&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: http://example.com/  (Optional Title Here)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: &amp;lt;http://example.com/&amp;gt;  &quot;Optional Title Here&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;如果使用空的方括号，则链接文本本身会作为名称。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[Google]: http://google.com/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[Google][]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a href=&quot;http://google.com/&quot; target=&quot;_blank&quot;&gt;Google&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;强调&lt;a href=&quot;#强调&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;em&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;strong&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 使用 &lt;strong&gt;星号 (*)&lt;/strong&gt; 或 &lt;strong&gt;下划线 (_)&lt;/strong&gt; 表示强调。&lt;strong&gt;一个分隔符&lt;/strong&gt;对应 &lt;code&gt;&amp;lt;em&amp;gt;&lt;/code&gt;；&lt;strong&gt;两个分隔符&lt;/strong&gt;对应 &lt;code&gt;&amp;lt;strong&amp;gt;&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*single asterisks*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;_single underscores_&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;**double asterisks**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;__double underscores__&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;em&gt;single asterisks&lt;/em&gt;&lt;/p&gt;&lt;p&gt;&lt;em&gt;single underscores&lt;/em&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;double asterisks&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;double underscores&lt;/strong&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;但如果两侧有空格，则会被视作普通字符而非强调语法。&lt;/p&gt;&lt;p&gt;你可以使用反斜杠进行转义：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;\*this text is surrounded by literal asterisks\*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;*this text is surrounded by literal asterisks*&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;行内代码&lt;a href=&quot;#行内代码&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;code&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;用&lt;strong&gt;反引号 (`)&lt;/strong&gt; 包裹。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Use the `printf()` function.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Use the &lt;code&gt;printf()&lt;/code&gt; function.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;若行内代码中需要包含反引号字符，可使用&lt;strong&gt;多重反引号&lt;/strong&gt;作为定界符：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;``There is a literal backtick (`) here.``&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;code&gt;There is a literal backtick (`) here.&lt;/code&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;行内代码两侧的定界符允许包含空格（开头一个、结尾一个），方便在代码起始或结尾放置反引号字符：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;A single backtick in a code span: `` ` ``&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;A backtick-delimited string in a code span: `` `foo` ``&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;A single backtick in a code span: &lt;code&gt;`&lt;/code&gt;&lt;/p&gt;&lt;p&gt;A backtick-delimited string in a code span: &lt;code&gt;`foo`&lt;/code&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;图片&lt;a href=&quot;#图片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;img /&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 的图片语法与链接类似，支持行内与引用两种方式。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;行内图片&lt;a href=&quot;#行内图片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;行内图片语法：&lt;code&gt;![替代文本](URL &quot;标题&quot;)&lt;/code&gt;&lt;/p&gt;&lt;p&gt;标题可选。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![Alt text](/path/to/img.jpg)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![Alt text](/path/to/img.jpg &quot;Optional title&quot;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp&quot; alt=&quot;Alt text&quot; /&gt;&lt;figcaption&gt;Alt text&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp&quot; alt=&quot;Alt text&quot; title=&quot;Optional title&quot; /&gt;&lt;figcaption&gt;Alt text&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;说明：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;一个感叹号 !；&lt;/li&gt;
&lt;li&gt;后接方括号，放置图片的替代文本；&lt;/li&gt;
&lt;li&gt;再接圆括号，内含图片 URL/路径，及可选的标题（引号包裹）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;引用式图片&lt;a href=&quot;#引用式图片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;引用式图片语法：&lt;code&gt;![替代文本][id]&lt;/code&gt;&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[img id]: https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp  &quot;Optional title attribute&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![Alt text][img id]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp&quot; alt=&quot;Alt text&quot; title=&quot;Optional title attribute&quot; /&gt;&lt;figcaption&gt;Alt text&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;删除线&lt;a href=&quot;#删除线&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;del&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;这是扩展语法。&lt;/p&gt;&lt;p&gt;GFM 增加了删除线语法。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;~~Mistaken text.~~&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Mistaken text.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;杂项&lt;a href=&quot;#杂项&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;自动链接&lt;a href=&quot;#自动链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 支持一种便捷写法来创建“自动链接”（URL 与邮箱地址）：只需用尖括号将其包住即可。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;http://example.com/&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;address@example.com&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a href=&quot;http://example.com/&quot; target=&quot;_blank&quot;&gt;http://example.com/&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href=&quot;#&quot;&gt;address@example.com&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;GFM 会自动识别标准 URL 并转换为链接。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;https://github.com/emn178/markdown&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a href=&quot;https://github.com/emn178/markdown&quot; target=&quot;_blank&quot;&gt;https://github.com/emn178/markdown&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;反斜杠转义&lt;a href=&quot;#反斜杠转义&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 允许使用反斜杠来转义那些本用于 Markdown 语法的特殊字符，使其按字面显示。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;\*literal asterisks\*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;*literal asterisks*&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;以下字符可通过反斜杠转义以按字面量输出：&lt;/p&gt;&lt;p&gt;Code:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;\   backslash&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;`   backtick&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   asterisk&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;_   underscore&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;{}  curly braces&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[]  square brackets&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;()  parentheses&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;#   hash mark&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   plus sign&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   minus sign (hyphen)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;.   dot&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;!   exclamation mark&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;内联 HTML&lt;a href=&quot;#内联-html&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;对于 Markdown 语法未覆盖的标记，直接使用原生 HTML 即可。无需特别声明从 Markdown 切换到 HTML，直接写标签就行。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is a regular paragraph.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;table&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;tr&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;td&amp;gt;Foo&amp;lt;/td&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;/tr&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/table&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is another regular paragraph.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is a regular paragraph.&lt;/p&gt;&lt;table&gt;
    &lt;tbody&gt;&lt;tr&gt;
        &lt;td&gt;Foo&lt;/td&gt;
    &lt;/tr&gt;
&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;This is another regular paragraph.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;请注意：在&lt;strong&gt;块级 HTML 标签&lt;/strong&gt;内不会处理 Markdown 语法。&lt;/p&gt;&lt;p&gt;与块级标签不同，在&lt;strong&gt;行内级标签&lt;/strong&gt;内会处理 Markdown 语法。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;span&amp;gt;**Work**&amp;lt;/span&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;**No Work**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;span&gt;&lt;strong&gt;Work&lt;/strong&gt;&lt;/span&gt;&lt;/p&gt;&lt;div&gt;
  **No Work**
&lt;/div&gt;
***&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>Markdown 教程</title><link>https://firefly.cuteleaf.cn/posts/markdown%E6%95%99%E7%A8%8B/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/markdown%E6%95%99%E7%A8%8B/</guid><description>一个简明的 Markdown 博客示例。</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;这是一个展示如何编写 Markdown 文件的示例。本文档汇总了核心语法与常见扩展（GFM）。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#block-elements&quot;&gt;块级元素&lt;/a&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#paragraphs-and-line-breaks&quot;&gt;段落与换行&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#headers&quot;&gt;标题&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#blockquotes&quot;&gt;引用&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#lists&quot;&gt;列表&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#code-blocks&quot;&gt;代码块&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#horizontal-rules&quot;&gt;分割线&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#table&quot;&gt;表格&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#span-elements&quot;&gt;内联元素&lt;/a&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#links&quot;&gt;链接&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#emphasis&quot;&gt;强调&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#code&quot;&gt;行内代码&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#images&quot;&gt;图片&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#strikethrough&quot;&gt;删除线&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#miscellaneous&quot;&gt;杂项&lt;/a&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;#automatic-links&quot;&gt;自动链接&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#backslash-escapes&quot;&gt;反斜杠转义&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;#inline-html&quot;&gt;内联 HTML&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;
&lt;section&gt;&lt;h2&gt;块级元素&lt;a href=&quot;#块级元素&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;段落与换行&lt;a href=&quot;#段落与换行&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;section&gt;&lt;h4&gt;段落&lt;a href=&quot;#段落&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;p&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;使用一个或多个空行分隔段落。（仅包含&lt;strong&gt;空格&lt;/strong&gt;或&lt;strong&gt;制表符&lt;/strong&gt;的行也视为空行。）&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This will be&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;inline.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is second paragraph.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This will be
inline.&lt;/p&gt;&lt;p&gt;This is second paragraph.&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;换行&lt;a href=&quot;#换行&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;br /&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;在行末添加&lt;strong&gt;两个或更多空格&lt;/strong&gt;来产生换行。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This will be not&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;inline.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This will be not&lt;br /&gt;
inline.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;标题&lt;a href=&quot;#标题&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 支持两种标题样式：Setext 与 atx。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;Setext&lt;a href=&quot;#setext&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;使用&lt;strong&gt;等号 (=)&lt;/strong&gt; 表示 &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;、使用&lt;strong&gt;短横线 (-)&lt;/strong&gt; 表示 &lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;，数量不限，作为“下划线”。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is an H1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;=============&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is an H2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-------------&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;This is an H1&lt;a href=&quot;#this-is-an-h1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;This is an H2&lt;a href=&quot;#this-is-an-h2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;hr /&gt;&lt;section&gt;&lt;h4&gt;atx&lt;a href=&quot;#atx&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h2&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h3&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h4&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h5&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;h6&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;在行首使用 1-6 个&lt;strong&gt;井号 (#)&lt;/strong&gt;，对应 &lt;code&gt;&amp;lt;h1&amp;gt;&lt;/code&gt; 至 &lt;code&gt;&amp;lt;h6&amp;gt;&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# This is an H1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;## This is an H2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;###### This is an H6&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;This is an H1&lt;a href=&quot;#this-is-an-h1-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;This is an H2&lt;a href=&quot;#this-is-an-h2-1&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h6&gt;This is an H6&lt;a href=&quot;#this-is-an-h6&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h6&gt;&lt;hr /&gt;&lt;p&gt;可选：你可以在行尾“闭合” atx 标题。末尾的井号数量&lt;strong&gt;不必与&lt;/strong&gt;开头一致。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# This is an H1 #&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;## This is an H2 ##&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;### This is an H3 ######&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h1&gt;This is an H1&lt;a href=&quot;#this-is-an-h1-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;section&gt;&lt;h2&gt;This is an H2&lt;a href=&quot;#this-is-an-h2-2&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;This is an H3&lt;a href=&quot;#this-is-an-h3&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;引用&lt;a href=&quot;#引用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 使用邮件风格的 &lt;strong&gt;&amp;gt;&lt;/strong&gt; 作为引用符号。若手动换行并在每行前加 &amp;gt;，显示效果最佳。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; id sem consectetuer libero luctus adipiscing.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;p&gt;This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/p&gt;&lt;p&gt;Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
id sem consectetuer libero luctus adipiscing.&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;Markdown 允许“偷懒”：在一个硬换行段落中，只在第一行前加 &amp;gt; 即可。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;id sem consectetuer libero luctus adipiscing.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;p&gt;This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.&lt;/p&gt;&lt;/blockquote&gt;&lt;blockquote&gt;&lt;p&gt;Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
id sem consectetuer libero luctus adipiscing.&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;引用可以嵌套（引用中的引用），通过增加 &amp;gt; 层级实现。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; This is the first level of quoting.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; &amp;gt; This is nested blockquote.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Back to the first level.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;p&gt;This is the first level of quoting.&lt;/p&gt;&lt;blockquote&gt;&lt;p&gt;This is nested blockquote.&lt;/p&gt;&lt;/blockquote&gt;&lt;p&gt;Back to the first level.&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;引用内可包含其他 Markdown 元素，包括标题、列表与代码块。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; ## This is a header.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 1.   This is the first list item.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; 2.   This is the second list item.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt; Here&apos;s some example code:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;gt;     return shell_exec(&quot;echo $input | $markdown_script&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;blockquote&gt;&lt;h2&gt;This is a header.&lt;a href=&quot;#this-is-a-header&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;This is the first list item.&lt;/li&gt;
&lt;li&gt;This is the second list item.&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;Here’s some example code:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;return shell_exec(&quot;echo $input | $markdown_script&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;列表&lt;a href=&quot;#列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 支持有序（数字）与无序（圆点）列表。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;无序列表&lt;a href=&quot;#无序列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;ul&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;无序列表可使用 &lt;strong&gt;星号 (*)&lt;/strong&gt;、&lt;strong&gt;加号 (+)&lt;/strong&gt; 或 &lt;strong&gt;短横线 (-)&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   Red&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   Green&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   Blue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;Red&lt;/li&gt;
&lt;li&gt;Green&lt;/li&gt;
&lt;li&gt;Blue&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;p&gt;等价于：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   Red&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   Green&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   Blue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;或者：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   Red&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   Green&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   Blue&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;有序列表&lt;a href=&quot;#有序列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;ol&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;有序列表使用数字加英文句点：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;1.  Bird&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;2.  McHale&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;3.  Parish&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ol&gt;
&lt;li&gt;Bird&lt;/li&gt;
&lt;li&gt;McHale&lt;/li&gt;
&lt;li&gt;Parish&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;p&gt;注意：像下面这样可能会“意外触发”有序列表：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;1986. What a great season.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ol&gt;
&lt;li&gt;What a great season.&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;p&gt;你可以用&lt;strong&gt;反斜杠转义 (\)&lt;/strong&gt; 句点：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;1986\. What a great season.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;1986. What a great season.&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;列表中的缩进内容&lt;a href=&quot;#列表中的缩进内容&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;section&gt;&lt;h5&gt;列表项里的引用&lt;a href=&quot;#列表项里的引用&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h5&gt;&lt;p&gt;在列表项内放置引用，需要将 &amp;gt; 符号整体缩进：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   A list item with a blockquote:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;gt; This is a blockquote&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;gt; inside a list item.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;A list item with a blockquote:&lt;/p&gt;
&lt;blockquote&gt;&lt;p&gt;This is a blockquote
inside a list item.&lt;/p&gt;&lt;/blockquote&gt;
&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h5&gt;列表项里的代码块&lt;a href=&quot;#列表项里的代码块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h5&gt;&lt;p&gt;在列表项内放置代码块，需要缩进两层——&lt;strong&gt;8 个空格&lt;/strong&gt;或&lt;strong&gt;两个 Tab&lt;/strong&gt;：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   A list item with a code block:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;code goes here&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;A list item with a code block:&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;code goes here&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h5&gt;嵌套列表&lt;a href=&quot;#嵌套列表&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h5&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* A&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* A1&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;* A2&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* B&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* C&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;ul&gt;
&lt;li&gt;A
&lt;ul&gt;
&lt;li&gt;A1&lt;/li&gt;
&lt;li&gt;A2&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;B&lt;/li&gt;
&lt;li&gt;C&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;代码块&lt;a href=&quot;#代码块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;pre&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;将代码块中的每行缩进至少&lt;strong&gt;4 个空格&lt;/strong&gt;或&lt;strong&gt;1 个制表符&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is a normal paragraph:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;This is a code block.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is a normal paragraph:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is a code block.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;p&gt;代码块会一直持续，直到遇到未缩进的行（或文末）。&lt;/p&gt;&lt;p&gt;在代码块内，&lt;strong&gt;与号 (&amp;amp;)&lt;/strong&gt; 和尖括号 &lt;strong&gt;(&amp;lt; &amp;gt;)&lt;/strong&gt; 会自动转为 HTML 实体。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;div class=&quot;footer&quot;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;amp;copy; 2004 Foo Corporation&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;div class=&quot;footer&quot;&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;amp;copy; 2004 Foo Corporation&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;p&gt;下文的“围栏代码块”和“语法高亮”属于扩展语法，你也可以用它们来书写代码块。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;围栏代码块&lt;a href=&quot;#围栏代码块&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;使用成对的反引号围起来（如下所示），就不需要四空格缩进了。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Here&apos;s an example:&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function test() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console.log(&quot;notice the blank line before this function?&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Here’s an example:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;function test() {&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;  &lt;/span&gt;&lt;/span&gt;&lt;span&gt;console.log(&quot;notice the blank line before this function?&quot;);&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;语法高亮&lt;a href=&quot;#语法高亮&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;在围栏代码块后添加可选的语言标识，即可启用语法高亮（参见支持语言列表）。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```ruby&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;require &apos;redcarpet&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;markdown = Redcarpet.new(&quot;Hello World!&quot;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;puts markdown.to_html&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;```&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;require &lt;/span&gt;&lt;span&gt;&apos;redcarpet&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;markdown&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;Redcarpet&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;span&gt;new&lt;/span&gt;&lt;span&gt;(&lt;/span&gt;&lt;span&gt;&quot;Hello World!&quot;&lt;/span&gt;&lt;span&gt;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;puts&lt;/span&gt;&lt;span&gt; markdown.&lt;/span&gt;&lt;span&gt;to_html&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;分割线（水平线）&lt;a href=&quot;#分割线水平线&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;hr /&amp;gt;&lt;/code&gt;
一行中放置&lt;strong&gt;三个或以上的短横线 (-)、星号 (*) 或下划线 (_)&lt;/strong&gt;。符号之间允许有空格。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;* * *&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;***&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*****&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;- - -&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---------------------------------------&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;___&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;表格&lt;a href=&quot;#表格&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;table&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;这是扩展语法。&lt;/p&gt;&lt;p&gt;用&lt;strong&gt;竖线 (|)&lt;/strong&gt; 分隔列，用&lt;strong&gt;短横线 (-)&lt;/strong&gt; 分隔表头，使用&lt;strong&gt;冒号 (:)&lt;/strong&gt; 指定对齐方式。&lt;/p&gt;&lt;p&gt;两侧的&lt;strong&gt;竖线 (|)&lt;/strong&gt; 与对齐可选。用于表头分隔时，每列至少需要 &lt;strong&gt;3 个短横线&lt;/strong&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;| Left | Center | Right |&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;|:-----|:------:|------:|&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;|aaa   |bbb     |ccc    |&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;|ddd   |eee     |fff    |&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;A | B&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---|---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;123|456&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;A |B&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;--|--&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;12|45&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;



















&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;Left&lt;/th&gt;&lt;th&gt;Center&lt;/th&gt;&lt;th&gt;Right&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;aaa&lt;/td&gt;&lt;td&gt;bbb&lt;/td&gt;&lt;td&gt;ccc&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;ddd&lt;/td&gt;&lt;td&gt;eee&lt;/td&gt;&lt;td&gt;fff&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;












&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;A&lt;/th&gt;&lt;th&gt;B&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;123&lt;/td&gt;&lt;td&gt;456&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;












&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;A&lt;/th&gt;&lt;th&gt;B&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;12&lt;/td&gt;&lt;td&gt;45&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;内联元素&lt;a href=&quot;#内联元素&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;链接&lt;a href=&quot;#链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;a&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 支持两种链接样式：行内链接与引用式链接。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;行内链接&lt;a href=&quot;#行内链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;行内链接格式：&lt;code&gt;[文本](URL &quot;标题&quot;)&lt;/code&gt;&lt;/p&gt;&lt;p&gt;标题可选。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is [an example](http://example.com/ &quot;Title&quot;) inline link.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[This link](http://example.net/) has no title attribute.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is &lt;a href=&quot;http://example.com/&quot; target=&quot;_blank&quot;&gt;an example&lt;/a&gt; inline link.&lt;/p&gt;&lt;p&gt;&lt;a href=&quot;http://example.net/&quot; target=&quot;_blank&quot;&gt;This link&lt;/a&gt; has no title attribute.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;如果引用同一站点的本地资源，可以使用相对路径：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;See my [About](/about/) page for details.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;See my &lt;a href=&quot;/about/&quot;&gt;About&lt;/a&gt; page for details.&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;引用式链接&lt;a href=&quot;#引用式链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;可以预定义链接引用。定义格式：&lt;code&gt;[id]: URL &quot;标题&quot;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;标题同样可选。引用时使用：&lt;code&gt;[文本][id]&lt;/code&gt;&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[id]: http://example.com/  &quot;Optional Title Here&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is [an example][id] reference-style link.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is &lt;a href=&quot;http://example.com/&quot; target=&quot;_blank&quot;&gt;an example&lt;/a&gt; reference-style link.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;说明：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;方括号中包含链接标识（&lt;strong&gt;不区分大小写&lt;/strong&gt;，可在左侧缩进最多三格空格）；&lt;/li&gt;
&lt;li&gt;随后是冒号；&lt;/li&gt;
&lt;li&gt;再跟一个或多个空格（或 tab）；&lt;/li&gt;
&lt;li&gt;然后是链接 URL；&lt;/li&gt;
&lt;li&gt;URL 可选地用尖括号包裹；&lt;/li&gt;
&lt;li&gt;可选地跟随标题属性，用引号或圆括号包裹。&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;以下三种定义等价：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: http://example.com/  &quot;Optional Title Here&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: http://example.com/  &apos;Optional Title Here&apos;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: http://example.com/  (Optional Title Here)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[foo]: &amp;lt;http://example.com/&amp;gt;  &quot;Optional Title Here&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;如果使用空的方括号，则链接文本本身会作为名称。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[Google]: http://google.com/&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[Google][]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a href=&quot;http://google.com/&quot; target=&quot;_blank&quot;&gt;Google&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;强调&lt;a href=&quot;#强调&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;em&amp;gt;&lt;/code&gt;，&lt;code&gt;&amp;lt;strong&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 使用 &lt;strong&gt;星号 (*)&lt;/strong&gt; 或 &lt;strong&gt;下划线 (_)&lt;/strong&gt; 表示强调。&lt;strong&gt;一个分隔符&lt;/strong&gt;对应 &lt;code&gt;&amp;lt;em&amp;gt;&lt;/code&gt;；&lt;strong&gt;两个分隔符&lt;/strong&gt;对应 &lt;code&gt;&amp;lt;strong&amp;gt;&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*single asterisks*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;_single underscores_&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;**double asterisks**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;__double underscores__&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;em&gt;single asterisks&lt;/em&gt;&lt;/p&gt;&lt;p&gt;&lt;em&gt;single underscores&lt;/em&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;double asterisks&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;double underscores&lt;/strong&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;但如果两侧有空格，则会被视作普通字符而非强调语法。&lt;/p&gt;&lt;p&gt;你可以使用反斜杠进行转义：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;\*this text is surrounded by literal asterisks\*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;*this text is surrounded by literal asterisks*&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;行内代码&lt;a href=&quot;#行内代码&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;code&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;用&lt;strong&gt;反引号 (`)&lt;/strong&gt; 包裹。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Use the `printf()` function.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Use the &lt;code&gt;printf()&lt;/code&gt; function.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;若行内代码中需要包含反引号字符，可使用&lt;strong&gt;多重反引号&lt;/strong&gt;作为定界符：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;``There is a literal backtick (`) here.``&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;code&gt;There is a literal backtick (`) here.&lt;/code&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;行内代码两侧的定界符允许包含空格（开头一个、结尾一个），方便在代码起始或结尾放置反引号字符：&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;A single backtick in a code span: `` ` ``&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;A backtick-delimited string in a code span: `` `foo` ``&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;A single backtick in a code span: &lt;code&gt;`&lt;/code&gt;&lt;/p&gt;&lt;p&gt;A backtick-delimited string in a code span: &lt;code&gt;`foo`&lt;/code&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;图片&lt;a href=&quot;#图片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;img /&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;Markdown 的图片语法与链接类似，支持行内与引用两种方式。&lt;/p&gt;&lt;section&gt;&lt;h4&gt;行内图片&lt;a href=&quot;#行内图片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;行内图片语法：&lt;code&gt;![替代文本](URL &quot;标题&quot;)&lt;/code&gt;&lt;/p&gt;&lt;p&gt;标题可选。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![Alt text](/path/to/img.jpg)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![Alt text](/path/to/img.jpg &quot;Optional title&quot;)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp&quot; alt=&quot;Alt text&quot; /&gt;&lt;figcaption&gt;Alt text&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp&quot; alt=&quot;Alt text&quot; title=&quot;Optional title&quot; /&gt;&lt;figcaption&gt;Alt text&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;说明：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;一个感叹号 !；&lt;/li&gt;
&lt;li&gt;后接方括号，放置图片的替代文本；&lt;/li&gt;
&lt;li&gt;再接圆括号，内含图片 URL/路径，及可选的标题（引号包裹）。&lt;/li&gt;
&lt;/ul&gt;&lt;/section&gt;&lt;section&gt;&lt;h4&gt;引用式图片&lt;a href=&quot;#引用式图片&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h4&gt;&lt;p&gt;引用式图片语法：&lt;code&gt;![替代文本][id]&lt;/code&gt;&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[img id]: https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp  &quot;Optional title attribute&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;![Alt text][img id]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;/p&gt;&lt;figure&gt;&lt;img src=&quot;https://s2.loli.net/2024/08/20/5fszgXeOxmL3Wdv.webp&quot; alt=&quot;Alt text&quot; title=&quot;Optional title attribute&quot; /&gt;&lt;figcaption&gt;Alt text&lt;/figcaption&gt;&lt;/figure&gt;&lt;p&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;删除线&lt;a href=&quot;#删除线&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;HTML 标签：&lt;code&gt;&amp;lt;del&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;p&gt;这是扩展语法。&lt;/p&gt;&lt;p&gt;GFM 增加了删除线语法。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;~~Mistaken text.~~&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;Mistaken text.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;杂项&lt;a href=&quot;#杂项&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;section&gt;&lt;h3&gt;自动链接&lt;a href=&quot;#自动链接&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 支持一种便捷写法来创建“自动链接”（URL 与邮箱地址）：只需用尖括号将其包住即可。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;http://example.com/&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;address@example.com&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a href=&quot;http://example.com/&quot; target=&quot;_blank&quot;&gt;http://example.com/&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href=&quot;#&quot;&gt;address@example.com&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;GFM 会自动识别标准 URL 并转换为链接。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;https://github.com/emn178/markdown&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a href=&quot;https://github.com/emn178/markdown&quot; target=&quot;_blank&quot;&gt;https://github.com/emn178/markdown&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;反斜杠转义&lt;a href=&quot;#反斜杠转义&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;Markdown 允许使用反斜杠来转义那些本用于 Markdown 语法的特殊字符，使其按字面显示。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;\*literal asterisks\*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;*literal asterisks*&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;以下字符可通过反斜杠转义以按字面量输出：&lt;/p&gt;&lt;p&gt;Code:&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;\   backslash&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;`   backtick&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;*   asterisk&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;_   underscore&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;{}  curly braces&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[]  square brackets&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;()  parentheses&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;#   hash mark&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;+   plus sign&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;-   minus sign (hyphen)&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;.   dot&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;!   exclamation mark&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;&lt;a&gt;&lt;/a&gt;&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;内联 HTML&lt;a href=&quot;#内联-html&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;对于 Markdown 语法未覆盖的标记，直接使用原生 HTML 即可。无需特别声明从 Markdown 切换到 HTML，直接写标签就行。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is a regular paragraph.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;table&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;tr&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;        &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;td&amp;gt;Foo&amp;lt;/td&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;&amp;lt;/tr&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/table&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;This is another regular paragraph.&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;This is a regular paragraph.&lt;/p&gt;&lt;table&gt;
    &lt;tbody&gt;&lt;tr&gt;
        &lt;td&gt;Foo&lt;/td&gt;
    &lt;/tr&gt;
&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;This is another regular paragraph.&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;请注意：在&lt;strong&gt;块级 HTML 标签&lt;/strong&gt;内不会处理 Markdown 语法。&lt;/p&gt;&lt;p&gt;与块级标签不同，在&lt;strong&gt;行内级标签&lt;/strong&gt;内会处理 Markdown 语法。&lt;/p&gt;&lt;p&gt;代码：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;span&amp;gt;**Work**&amp;lt;/span&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;    &lt;/span&gt;&lt;/span&gt;&lt;span&gt;**No Work**&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;预览：&lt;/p&gt;&lt;hr /&gt;&lt;p&gt;&lt;span&gt;&lt;strong&gt;Work&lt;/strong&gt;&lt;/span&gt;&lt;/p&gt;&lt;div&gt;
  **No Work**
&lt;/div&gt;
***&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>在文章中嵌入视频</title><link>https://firefly.cuteleaf.cn/posts/video/</link><guid isPermaLink="true">https://firefly.cuteleaf.cn/posts/video/</guid><description>这篇文章演示如何在博客文章中嵌入视频。</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;只需从 YouTube 或其他平台复制嵌入代码，然后将其粘贴到 markdown 文件中。&lt;/p&gt;
&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;title&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;在文章中嵌入视频&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;published&lt;/span&gt;&lt;span&gt;: &lt;/span&gt;&lt;span&gt;2023-10-19&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;// ...&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;---&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;iframe width=&quot;100%&quot; height=&quot;468&quot; src=&quot;https://www.youtube.com/embed/5gIf0_xpFPI?si=N1WTorLKL0uwLsU_&quot; title=&quot;YouTube video player&quot; frameborder=&quot;0&quot; allowfullscreen&amp;gt;&amp;lt;/iframe&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;
&lt;section&gt;&lt;h2&gt;YouTube&lt;a href=&quot;#youtube&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;Bilibili&lt;a href=&quot;#bilibili&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt; &lt;/section&gt;</content:encoded></item></channel></rss>