ChuwuYo的小窝, 这里有我的日常、思考以及一些开发分享, 欢迎你的到来https://blog.chuwu.top/zh-CNhttps://blog.chuwu.top/posts/2025-09-29/unveiling/https://blog.chuwu.top/posts/2025-09-29/unveiling/ChuwuYo 博客的第一个版本，使用 Charlotte 主题构建Mon, 29 Sep 2025 00:00:00 GMT<h1>欢迎来到 Chuwu 的博客。</h1> <h2>这个博客是使用 <a href="https://astro.build/">Astro</a> 框架和基于 <a href="https://github.com/saicaca/fuwari">Fuwari</a> 的 <a href="https://github.com/ChuwuYo/Charlotte">Charlotte主题</a> 构建的。</h2> <p>关于是否建立一个博客，其实我想了很久，最后还是说服了自己，希望这份热情能持续下去。</p> <h3>不知道我们能走多久呢……</h3> <hr /> <p>感谢以下项目与项目开发者们：</p> <ul> <li><a href="https://github.com/saicaca/fuwari">saicaca-Fuwari</a></li> <li><a href="https://github.com/afoim/fuwari">afoim(二叉树树)-Fuwari</a></li> <li><a href="https://github.com/matsuzaka-yuki/Mizuki">yuki(松坂有希)-Mizuki</a></li> <li><a href="https://github.com/xingpingcn/enhanced-FaaS-in-China">enhanced-FaaS-in-China</a></li> <li><a href="https://vercel.cdn.yt-blog.top/">Vercel CDN</a></li> </ul> https://blog.chuwu.top/posts/2018-10-30/charlotte-markdown/https://blog.chuwu.top/posts/2018-10-30/charlotte-markdown/Charlotte-Markdown 是 Charlotte 主题的 Markdown 语法说明文档Tue, 30 Oct 2018 00:00:00 GMT<h1>Charlotte-Markdown 使用说明</h1> <blockquote> <p>本文直接参考<a href="https://github.com/saicaca/fuwari">Fuwari</a>的相关指南</p> </blockquote> <p><s>其实是为了防止未来的自己忘了该怎么写Post</s></p> <p>封面： <a href="https://www.pixiv.net/artworks/133535742">Collector</a> by <a href="https://www.pixiv.net/users/2642047">Ashima</a></p> <h1>创建文章</h1> <h2>文章元数据</h2> <pre><code>--- title: Charlotte-Markdown published: 2018-10-30 description: 'Charlotte-Markdown 是 Charlotte 主题的 Markdown 语法说明文档' image: './Markdown.webp' tags: [Charlotte, 公告, Markdown] category: '公告' draft: false lang: '' --- </code></pre> <table> <thead> <tr> <th>属性名</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><code>title</code></td> <td>文章标题</td> </tr> <tr> <td><code>published</code></td> <td>文章发表时间</td> </tr> <tr> <td><code>description</code></td> <td>文章简介。 会显示在主页上</td> </tr> <tr> <td><code>image</code></td> <td>文章封面图 1. 以 <code>http://</code> or <code>https://</code>开头: 使用网络图片 2. 以 <code>/</code>: 开头来使用 <code>public</code> 中的图片 3. 没有任何前缀：使用相对于Markdown文件的图片</td> </tr> <tr> <td><code>tags</code></td> <td>文章的标签</td> </tr> <tr> <td><code>category</code></td> <td>文章的分类</td> </tr> <tr> <td><code>draft</code></td> <td><code>true</code>或者<code>false</code>。是否为草稿。如果为<code>true</code>，则不会显示在主页上。</td> </tr> </tbody> </table> <h2>发布文章的存放位置</h2> <p>你发布的文章应当在 <code>src/content/posts/</code> 目录下. 你也可以创建一个子目录，用来存放文章和文章中的资源。</p> <pre><code>src/content/posts/ ├── post-1.md └── post-2/ ├── cover.png └── index.md </code></pre> <h1>Markdown 语法</h1> <h1>这是一个 h1 标题</h1> <h2>这是一个 h2 标题</h2> <h3>这是一个 h3 标题</h3> <p>段落之间用空行分隔。（或双空格+换行进行内部换行）</p> <p>这是第二段 <em>斜体</em>、<strong>粗体</strong>和 <code>代码行</code>。</p> <h1>无序列表</h1> <ul> <li>这是一项</li> <li>这是一项</li> <li>这是另一项</li> </ul> <h1>有序列表</h1> <ol> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol> <h1>嵌套列表</h1> <ol> <li> <p>首先有这两个对象</p> <ul> <li>你</li> <li>我</li> </ul> </li> <li> <p>一定要记住</p> </li> <li> <p>不能忘</p> <p><code>找到我</code></p> <p>说晚安</p> </li> </ol> <h1>链接和脚注</h1> <p>这里有一个链接到 <a href="http://bilibili.com">一个网站</a>、<a href="example.md">本地文档</a> 和 <a href="#%E8%BF%99%E6%98%AF%E4%B8%80%E4%B8%AA-h3-%E6%A0%87%E9%A2%98">当前文档中的某个章节标题</a>。这里有一个脚注<a href="%E8%BF%99%E6%98%AF%E8%84%9A%E6%B3%A8%E7%9A%84%E7%A4%BA%E4%BE%8B%E5%86%85%E5%AE%B9%EF%BC%8C%E7%82%B9%E5%87%BB%E8%84%9A%E6%B3%A8%E5%BC%95%E7%94%A8%E4%BC%9A%E8%B7%B3%E8%BD%AC%E5%88%B0%E8%BF%99%E9%87%8C%E3%80%82%EF%BC%88%E6%98%BE%E7%A4%BA%E5%9C%A8Post%E6%9C%80%E5%90%8E%EF%BC%89">^1</a>。</p> <h1>图片引用</h1> <h2>Markdown 语法引入图片</h2> <p>示例：</p> <pre><code> </code></pre> <p><img src="https://blog.chuwu.top/favicon/icon_256.webp" alt="头像图片" title="我的头像" /></p> <h2>HTML 标签引入图片</h2> <p>示例：</p> <pre><code>&lt;img src="/favicon/icon_256.webp" alt="头像图片" width="256" height="256" /&gt; </code></pre> <p>&lt;img src="/favicon/icon_256.webp" alt="头像图片" width="256" height="256" /&gt;</p> <h2>路径说明</h2> <p>图片路径有以下几种方式：</p> <ol> <li> <p><strong>网络图片</strong>：以 <code>http://</code> 或 <code>https://</code> 开头</p> <pre><code> </code></pre> </li> <li> <p><strong>公共目录图片</strong>：以 <code>/</code> 开头，相对于 <code>public</code> 目录</p> <pre><code> </code></pre> </li> <li> <p><strong>相对路径图片</strong>：相对于当前 Markdown 文件的位置</p> <pre><code> </code></pre> </li> </ol> <h1>数学公式</h1> <p>行内数学公式是这样写的：$\omega = d\phi / dt$。</p> <p>显示数学公式应该独占一行，用双美元符号包裹：</p> <p>$$I = \int \rho R^{2} dV$$</p> <p>$$ \begin{equation*} \pi =3.1415926535 ;8979323846;2643383279;5028841971;\ldots \end{equation*} $$</p> <h1>GitHub 仓库卡片</h1> <p>你可以添加一个链接到一个 GitHub 仓库的动态卡片。当页面加载时，将从 GitHub API 获取仓库信息。</p> <p>::github{repo="ChuwuYo/Charlotte"}</p> <p>创建一个 Github 仓库卡片，只需在 Markdown 文件中添加一行 <code>::github{repo="&lt;owner&gt;/&lt;repo&gt;"}</code>。</p> <pre><code>::github{repo="ChuwuYo/Charlotte"} </code></pre> <h1>警告</h1> <p>支持这些类型的警告: <code>note</code> <code>tip</code> <code>important</code> <code>warning</code> <code>caution</code></p> <p>:::note 突出显示用户在浏览时也应考虑的信息。 :::</p> <p>:::tip 可选的信息，以帮助用户更顺利地理解。 :::</p> <p>:::important 用户完成任务所必需的关键信息。 :::</p> <p>:::warning 关键内容，由于潜在风险需要用户立即关注。 :::</p> <p>:::caution 行动的负面潜在后果。 :::</p> <h2>基本语法</h2> <pre><code>:::note 突出显示用户在浏览时也应考虑的信息。 ::: :::tip 可选的信息，以帮助用户更顺利地理解。 ::: </code></pre> <h2>自定义标题</h2> <p>警告的标题可以自定义。</p> <p>:::note[自定义标题] 这是一个带有自定义标题的提示。 :::</p> <pre><code>:::note[自定义标题] 这是一个带有自定义标题的提示。 ::: </code></pre> <h2>GitHub 语法</h2> <blockquote> <p>[!TIP] 同时也支持 <a href="https://github.com/orgs/community/discussions/16925">GitHub 语法</a>。</p> </blockquote> <pre><code>&gt; [!NOTE] &gt; 也支持 GitHub 语法。 &gt; [!TIP] &gt; 也支持 GitHub 语法。 </code></pre> <h1>剧透内容</h1> <p>你可以为文本添加剧透。文本也支持 <strong>Markdown</strong> 语法。</p> <p>内容 :spoiler[被隐藏起来了 <strong>哈哈</strong>]！</p> <pre><code>内容 :spoiler[被隐藏起来了 **哈哈**]！ </code></pre> <h1>视频卡片</h1> <p>只需从 YouTube 或其他平台复制嵌入代码，然后将其粘贴到 markdown 文件中。</p> <h3>YouTube</h3> <p>只需从 YouTube 复制嵌入代码，然后粘贴到 Markdown 文件中即可。</p> <p>&lt;iframe width="560" height="315" src="https://www.youtube.com/embed/1MsuXjTlCGE?si=KykaK5Bgvq1W1hXI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen&gt;&lt;/iframe&gt;</p> <h1>杂项</h1> <h2>特殊符号</h2> <ul> <li><strong>长破折号</strong>：使用三个破折号 <code>---</code> 表示长破折号（——）</li> <li><strong>范围符号</strong>：使用两个破折号 <code>--</code> 表示范围（例如，"第 12—14 章"）</li> <li><strong>省略号</strong>：三个点 <code>...</code> 将被转换为省略号（……）</li> </ul> <h2>Unicode 支持</h2> <p>支持 Unicode 字符，例如表情符号：☺ ★ ♥ ♦ ♣ ♠ ● ○ ◇ ◆ □ ■ △ ▲ ※ → ← ↑ ↓</p> <h2>转义字符</h2> <p>如果需要显示特殊字符的原样，可以使用反斜杠 <code>\</code> 进行转义：</p> <ul> <li><code>\_</code> 显示为 <code>_</code>（而不是斜体）</li> <li><code>\*</code> 显示为 <code>*</code>（而不是粗体）</li> <li><code>\`` 显示为 `` </code>（而不是代码）</li> </ul> <h2>缩进</h2> <p>缩进始终保持为四个空格的距离，你也可以使用制表符（Tab）。</p> <h2>行块</h2> <p>| 第一行 | 第二行 | 第三行</p>