ydoc
Version:
基于 Markdown 的静态站点生成工具
190 lines • 16.3 kB
HTML
<html lang="zh-CN"><head><meta charSet="UTF-8"/><meta content="text/html; charset=utf-8" http-equiv="Content-Type"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/><meta name="apple-mobile-web-app-capable" content="yes"/><meta name="apple-mobile-web-app-status-bar-style" content="black"/><link rel="apple-touch-icon" sizes="180x180" href="../ydoc/images/apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="../ydoc/images/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="../ydoc/images/favicon-16x16.png"/><link rel="manifest" href="../ydoc/images/manifest.json"/><link rel="mask-icon" href="../ydoc/images/safari-pinned-tab.svg" color="#5bbad5"/><meta name="theme-color" content="#ffffff"/><meta http-equiv="Cache-Control" content="no-transform"/><meta http-equiv="Cache-Control" content="no-siteapp"/><title>Markdown一级标题-文档</title><link rel="stylesheet" href="../ydoc/styles/style.css"/><meta name="author" content="ymfe"/><meta name="keywords"/><meta name="description" content="ydoc description demo"/><meta id="releativePath" content=".."/><link rel="stylesheet" href="../ydoc/ydoc-plugin-search/search.css"/><link rel="stylesheet" href="../ydoc/ydoc-plugin-edit-page/editPage.css"/><link rel="stylesheet" href="../custom.css"/></head><body><div class="g-doc"><div class="m-aside"><div class="m-summary" id="js-menu"><div class="m-summary-content" id="js-menu-content"><div class="m-summary-block"><ul class="m-summary-list"><li class="item"><a href="index.html" class="href">快速开始</a></li></ul></div><div class="m-summary-block"><div class="m-summary-title">教程</div><ul class="m-summary-list indent"><li class="item"><a href="structure.html" class="href">目录结构</a></li><li class="item"><a href="nav.html" class="href">导航</a></li><li class="item"><div class="m-summary-block"><a href="pages-index.html" class="href">页面</a><ul class="m-summary-list indent"><li class="item"><a href="pages-index.html" class="href">首页</a></li><li class="item"><a href="pages-book.html" class="href">文档页</a></li><li class="item"><a href="pages-custom.html" class="href">自定义页面</a></li></ul></div></li><li class="item"><a href="config.html" class="href">配置文件</a></li><li class="item"><a href="" class="href">Markdown</a></li></ul></div><div class="m-summary-block"><div class="m-summary-title">命令</div><ul class="m-summary-list indent"><li class="item"><div class="m-summary-block"><a href="command-index.html" class="href">页面</a><ul class="m-summary-list indent"><li class="item"><a href="command-index.html#init-初始化" class="href">init 初始化</a></li><li class="item"><a href="command-index.html#build-构建" class="href">build 构建</a></li><li class="item"><a href="command-index.html#serve-服务" class="href">serve 服务</a></li><li class="item"><a href="command-index.html#theme-主题" class="href">theme 主题</a></li></ul></div></li></ul></div><div class="m-summary-block"><div class="m-summary-title">自定义</div><ul class="m-summary-list indent"><li class="item"><div class="m-summary-block"><a href="theme.html" class="href">主题</a><ul class="m-summary-list indent"><li class="item"><a href="template.html" class="href">模板与变量</a></li></ul></div></li><li class="item"><a href="jsx.html" class="href">JSX</a></li><li class="item"><div class="m-summary-block"><a href="plugins.html" class="href">扩展</a><ul class="m-summary-list indent"><li class="item"><a href="create.html" class="href">创建插件</a></li><li class="item"><a href="hooks.html" class="href">Hooks</a></li><li class="item"><a href="markdown-it.html" class="href">markdown扩展</a></li></ul></div></li><li class="item"><div class="m-summary-block"><a href="qa.html" class="href">常见问题</a><ul class="m-summary-list indent"><li class="item"><a href="qa.html#%e6%9b%bf%e6%8d%a2-favicon" class="href">替换 favicon</a></li><li class="item"><a href="qa.html#%e5%bc%95%e5%85%a5-js-%e5%92%8c-css" class="href">引入 js 和 css</a></li></ul></div></li></ul></div><div class="m-summary-block"><ul class="m-summary-list"><li class="item"><a href="release.html" class="href">版本历史</a></li></ul></div></div></div><div class="m-summary-switch" id="js-summary-switch"><svg viewBox="0 0 926.23699 573.74994" version="1.1" x="0px" y="0px" width="15" height="15" class="bottom"><g transform="translate(904.92214,-879.1482)"><path d="m -673.67664,1221.6502 -231.2455,-231.24803 55.6165,-55.627 c 30.5891,-30.59485 56.1806,-55.627 56.8701,-55.627 0.6894,0 79.8637,78.60862 175.9427,174.68583 l 174.6892,174.6858 174.6892,-174.6858 c 96.079,-96.07721 175.253196,-174.68583 175.942696,-174.68583 0.6895,0 26.281,25.03215 56.8701,55.627 l 55.6165,55.627 -231.245496,231.24803 c -127.185,127.1864-231.5279,231.248 -231.873,231.248 -0.3451,0 -104.688,-104.0616 -231.873,-231.248 z" fill="#fff"></path></g></svg><svg viewBox="0 0 926.23699 573.74994" version="1.1" x="0px" y="0px" width="15" height="15" class="top"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="aaa" fill="#fff" fill-rule="nonzero"><path d="M231.2455,342.502 L0,111.25397 L55.6165,55.62697 C86.2056,25.03212 111.7971,-2.99999998e-05 112.4866,-2.99999998e-05 C113.176,-2.99999998e-05 192.3503,78.60859 288.4293,174.6858 L463.1185,349.3716 L637.8077,174.6858 C733.8867,78.60859 813.060896,-2.99999997e-05 813.750396,-2.99999997e-05 C814.439896,-2.99999997e-05 840.031396,25.03212 870.620496,55.62697 L926.236996,111.25397 L694.9915,342.502 C567.8065,469.6884 463.4636,573.75 463.1185,573.75 C462.7734,573.75 358.4305,469.6884 231.2455,342.502 Z" id="Shape" transform="translate(463.118498, 286.874985) scale(1, -1) translate(-463.118498, -286.874985) "></path></g></g></svg></div></div><div class="m-main" id="js-panel"><header class="m-header" id="js-header"><div class="m-header-title js-logo"><a href="../index.html" target="_self"><img class="logo" width="36" src="../ydoc/images/dog@1x.png" srcSet="../ydoc/images/dog@2x.png 2x"/><h6 class="name">YDoc</h6></a></div><div><div class="m-search">
<div class="icon"></div>
<input type="text" class="input js-input" placeholder="搜索" />
<div class="m-search-result js-search-result"></div>
</div></div><nav class="m-header-nav js-nav"><ul class="m-header-items"><li class="item active"><a class="href" href="index.html">文档</a></li><li class="item "><a class="href" href="../plugin/index.html">插件</a></li><li class="item "><a class="href" href="../theme/index.html">主题</a></li><li class="item "><a class="href" href="../examples/index.html">示例 Demo</a></li><li class="item "><span class="href">规范</span><ul class="m-header-subtitle"><li class="item"><a href="../standard/style-guide.html" class="link">设计规范</a></li><li class="item"><a href="../standard/index.html" class="link">文档规范</a></li></ul></li></ul></nav><div id="js-nav-btn" class="m-header-btn ui-font-ydoc"></div></header><div class="m-content" id="js-content"><div id="markdown-body" class="m-content-container markdown-body"><h1>Markdown</h1>
<p>Markdown 是一种轻量级标记语言，它以纯文本形式(<em>易读、易写、易更改</em>)编写文档，并最终以 HTML 格式发布。Markdown也可以理解为将以 MARKDOWN 语法编写的语言转换成 HTML 内容的工具。</p>
<h2 id="语法规范">语法规范</h2>
<p>YDoc 使用了 <a href="https://spec.commonmark.org/" target="_blank">CommonMark 语法规范</a></p>
<h2 id="为什么要使用它">为什么要使用它</h2>
<ul>
<li>它是易读（看起开舒服）、易写（语法简单）、易更改<strong>纯文本</strong>。处处体现着<strong>极简主义</strong>的影子。</li>
<li>兼容 HTML，可以转换为 HTML 格式发布。</li>
<li>跨平台使用。</li>
<li>越来越多的网站支持 Markdown。</li>
<li>更方便清晰的组织你的电子邮件。（Markdown-here, Airmail）</li>
<li>摆脱 Word（我不是认真的）。</li>
</ul>
<p>如果不算扩展，Markdown 的语法绝对简单到让你爱不释手。</p>
<p>Markdown 语法主要分为如下几大部分： 标题，段落，区块引用，代码区块，强调，列表，分割线，链接，图片，反斜杠 \，符号'`'，表格。</p>
<h3 id="为什么要使用它-标题">标题</h3>
<p>使用<code>#</code>，可表示1-6级标题。</p>
<blockquote>
<p># 一级标题<br>
## 二级标题<br>
### 三级标题<br>
#### 四级标题<br>
##### 五级标题<br>
###### 六级标题</p>
</blockquote>
<p>效果：</p>
<blockquote>
<h1>一级标题</h1>
<h2 id="二级标题">二级标题</h2>
<h3 id="二级标题-三级标题">三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
</blockquote>
<h3 id="二级标题-段落">段落</h3>
<p>段落的前后要有空行，所谓的空行是指没有文字内容。若想在段内强制换行的方式是使用<strong>两个以上</strong>空格加上回车（引用中换行省略回车）。</p>
<h3 id="二级标题-区块引用">区块引用</h3>
<p>在段落的每行或者只在第一行使用符号<code>></code>,还可使用多个嵌套引用，如：</p>
<blockquote>
<p>> 区块引用<br>
>> 嵌套引用</p>
</blockquote>
<p>效果：</p>
<blockquote>
<p>区块引用</p>
<blockquote>
<p>嵌套引用</p>
</blockquote>
</blockquote>
<h3 id="二级标题-代码区块">代码区块</h3>
<p>代码区块的建立是在每行加上4个空格或者一个制表符（如同写代码一样）。如<br>
普通段落：</p>
<p>void main()<br>
{<br>
printf("Hello, Markdown.");<br>
}</p>
<p>代码区块：</p>
<pre><code>void main()
{
printf("Hello, Markdown.");
}
</code></pre>
<p><strong>注意</strong>:需要和普通段落之间存在空行。</p>
<h3 id="二级标题-强调">强调</h3>
<p>在强调内容两侧分别加上<code>*</code>或者<code>_</code>，如：</p>
<blockquote>
<p>*斜体*，_斜体_<br>
**粗体**，__粗体__</p>
</blockquote>
<p>效果：</p>
<blockquote>
<p><em>斜体</em>，<em>斜体</em><br>
<strong>粗体</strong>，<strong>粗体</strong></p>
</blockquote>
<h3 id="二级标题-列表">列表</h3>
<p>使用<code>·</code>、<code>+</code>、或<code>-</code>标记无序列表，如：</p>
<blockquote>
<p>-（+*） 第一项
-（+*） 第二项
- （+*）第三项</p>
</blockquote>
<p><strong>注意</strong>：标记后面最少有一个 <strong>空格</strong> 或 <strong>制表符</strong> 。若不在引用区块中，必须和前方段落之间存在空行。</p>
<p>效果：</p>
<blockquote>
<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ul>
</blockquote>
<p>有序列表的标记方式是将上述的符号换成数字,并辅以<code>.</code>，如：</p>
<blockquote>
<p>1 . 第一项<br>
2 . 第二项<br>
3 . 第三项</p>
</blockquote>
<p>效果：</p>
<blockquote>
<ol>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ol>
</blockquote>
<h3 id="二级标题-分割线">分割线</h3>
<p>分割线最常使用就是三个或以上<code>*</code>，还可以使用<code>-</code>和<code>_</code>。</p>
<h3 id="二级标题-链接">链接</h3>
<p>链接可以由两种形式生成：<strong>行内式</strong>和<strong>参考式</strong>。<br>
<strong>行内式</strong>：</p>
<blockquote>
<p>[url](https:://github.com/ymfe "Markdown")。</p>
</blockquote>
<p>效果：</p>
<blockquote>
<p><a href="https:://github.com/ymfe" title="Markdown">url</a></p>
</blockquote>
<h3 id="二级标题-图片">图片</h3>
<p>添加图片的形式和链接相似，只需在链接的基础上前方加一个<code>!</code>。</p>
<h3 id="二级标题-反斜杠\">反斜杠<code>\</code></h3>
<p>相当于<strong>反转义</strong>作用。使符号成为普通符号。</p>
<h3 id="二级标题-符号'`'">符号'`'</h3>
<p>起到标记作用。如：</p>
<blockquote>
<p>`ctrl+a`</p>
</blockquote>
<p>效果：</p>
<blockquote>
<p><code>ctrl+a</code></p>
</blockquote>
<h3 id="二级标题-表格">表格</h3>
<p>用<code>|</code>表示表格纵向边界，表头和表内容用<code>-</code>隔开，并可用<code>:</code>进行对齐设置，两边都有<code>:</code>则表示居中，若不加<code>:</code>则默认左对齐。</p>
<pre><code class="language-markdown"><span class="token table"><span class="token table-header-row"><span class="token punctuation">|</span><span class="token table-header important">key </span><span class="token punctuation">|</span><span class="token table-header important"> value </span><span class="token punctuation">|</span>
</span><span class="token table-line"><span class="token punctuation">|</span><span class="token punctuation">:-----------:</span><span class="token punctuation">|</span><span class="token punctuation">------</span> <span class="token punctuation">|</span>
</span><span class="token table-data-rows"><span class="token punctuation">|</span><span class="token table-data">title </span><span class="token punctuation">|</span><span class="token table-data"> ydoc </span><span class="token punctuation">|</span>
<span class="token punctuation">|</span><span class="token table-data">content </span><span class="token punctuation">|</span><span class="token table-data"> ydoc </span><span class="token punctuation">|</span>
</span></span>
</code></pre>
<p>效果：</p>
<table>
<thead>
<tr>
<th style="text-align:center">key</th>
<th>value</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center">title</td>
<td>ydoc</td>
</tr>
<tr>
<td style="text-align:center">content</td>
<td>ydoc</td>
</tr>
</tbody>
</table>
</div><div class="m-content-container m-paging"><div class="m-paging-prev m-paging-item"><a href="config.html" class="href"><span class="ui-font-ydoc"></span>配置文件</a></div><div class="m-paging-next m-paging-item"><a href="command-index.html" class="href">页面<span class="ui-font-ydoc"></span></a></div></div></div></div></div><div></div><script>
var $content = document.getElementById('js-content');
var $summaryItems = Array.prototype.slice.call(document.querySelectorAll('#js-menu .href'));
var $menu = document.getElementById('js-menu');
if (sessionStorage.prevPathname) {
sessionStorage.setItem('prevPrevPathname', sessionStorage.prevPathname);
sessionStorage.setItem('prevPrevMenuScrollTop', sessionStorage.prevMenuScrollTop);
sessionStorage.setItem('prevPrevContentScrollTop', sessionStorage.prevContentScrollTop);
}
if (sessionStorage.locationPathname) {
sessionStorage.setItem('prevPathname', sessionStorage.locationPathname);
sessionStorage.setItem('prevMenuScrollTop', sessionStorage.menuScrollTop);
sessionStorage.setItem('prevContentScrollTop', sessionStorage.contentScrollTop);
}
if ($menu && sessionStorage.menuScrollTop) {
$menu.scrollTop = sessionStorage.menuScrollTop;
}
// 刷新页面但不切换 pathname 的时候，内容区恢复到记忆的高度
if ($content && sessionStorage.contentScrollTop && window.location.pathname == sessionStorage.locationPathname) {
$content.scrollTop = sessionStorage.contentScrollTop;
} else if (sessionStorage.prevPrevPathname && sessionStorage.prevPrevPathname === window.location.pathname) {
if ($menu && sessionStorage.prevPrevMenuScrollTop) {
$menu.scrollTop = sessionStorage.prevPrevMenuScrollTop;
}
if ($content && sessionStorage.prevPrevContentScrollTop) {
$content.scrollTop = sessionStorage.prevPrevContentScrollTop;
}
}
sessionStorage.setItem('locationPathname', window.location.pathname);
</script><script src="../ydoc/scripts/plugins/dollar.min.js"></script><script src="../ydoc/scripts/plugins/responsive-nav.min.js"></script><script src="../ydoc/scripts/plugins/slideout.min.js"></script><script src="../ydoc/scripts/app.js"></script><script src="../ydoc/ydoc-plugin-search/core.js"></script><script src="../ydoc/ydoc-plugin-search/search.js"></script><script src="../ydoc/ydoc-plugin-edit-page/edit.script.js"></script><script src="../search_json.js"></script><script src="../edit_json.js"></script></body></html>