forked from CrossDark/CrossDown
285 lines
9.9 KiB
HTML
285 lines
9.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>UTF-8编码示例</title>
|
||
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML"></script>
|
||
<link href="https://cdn.jsdelivr.net/npm/prismjs/themes/prism.css" rel="stylesheet" />
|
||
<script src="https://cdn.jsdelivr.net/npm/prismjs/prism.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/prismjs/components/prism-yaml.min.js"></script>
|
||
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
|
||
<style>
|
||
.block {
|
||
background-color: grey; /* 灰色背景 */
|
||
color: white; /* 白色文字 */
|
||
}
|
||
</style>
|
||
<!-- 可以在这里添加其他元数据和CSS链接 -->
|
||
</head>
|
||
<body>
|
||
<script>
|
||
mermaid.initialize({{startOnLoad:true}});
|
||
</script>
|
||
<script>
|
||
document.addEventListener("DOMContentLoaded", function() {
|
||
emojify.run();
|
||
});
|
||
</script>
|
||
<div class="toc">
|
||
<ul>
|
||
<li><a href="#crossdown">CrossDown</a></li>
|
||
<li><a href="#11">1{#1} 基本语法</a><ul>
|
||
<li><a href="#1111">1.1{#1.1} 标题</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#_1">一级标题</a><ul>
|
||
<li><a href="#_2">二级标题</a><ul>
|
||
<li><a href="#_3">三级标题</a><ul>
|
||
<li><a href="#_4">四级标题</a><ul>
|
||
<li><a href="#_5">五级标题</a><ul>
|
||
<li><a href="#_6">六级标题</a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#1212">1.2{#1.2} 样式</a><ul>
|
||
<li><a href="#121121">1.2.1{#1.2.1} 斜体</a></li>
|
||
<li><a href="#122122">1.2.2{#1.2.2} 粗体</a></li>
|
||
<li><a href="#123123">1.2.3{#1.2.3} 粗斜体</a></li>
|
||
<li><a href="#124124">1.2.4{#1.2.4} 下划线</a></li>
|
||
<li><a href="#125125">1.2.5{#1.2.5} 删除线</a></li>
|
||
<li><a href="#126126">1.2.6{#1.2.6} 高亮</a></li>
|
||
<li><a href="#127127">1.2.7{#1.2.7} 在文本的正上方添加一行小文本主要用于标拼音</a></li>
|
||
<li><a href="#128128">1.2.8{#1.2.8} 在指定的文本里面隐藏一段文本</a></li>
|
||
<li><a href="#129129">1.2.9{#1.2.9} 分割线</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#1313">1.3{#1.3} 链接</a><ul>
|
||
<li><a href="#131131">1.3.1{#1.3.1} 普通链接</a></li>
|
||
<li><a href="#132132">1.3.2{#1.3.2} 图片</a></li>
|
||
<li><a href="#133133">1.3.3{#1.3.3} 变量链接</a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#22">2{#2} 变量</a><ul>
|
||
<li><a href="#2121">2.1{#2.1} 定义</a></li>
|
||
<li><a href="#2222">2.2{#2.2} 赋值</a></li>
|
||
<li><a href="#2323">2.3{#2.3} 添加锚点</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#33">3{#3} 代码块</a><ul>
|
||
<li><a href="#3131">3.1{#3.1} 单行</a><ul>
|
||
<li><a href="#311311-latex">3.1.1{#3.1.1} LaTex</a></li>
|
||
<li><a href="#312312">3.1.2{#3.1.2} 函数</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#3232">3.2{#3.2} 多行</a><ul>
|
||
<li><a href="#321321-yaml">3.2.1{#3.2.1} YAML</a></li>
|
||
<li><a href="#322322-python">3.2.2{#3.2.2} Python</a></li>
|
||
<li><a href="#323323-mermaid">3.2.3{#3.2.3} Mermaid</a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#44">4{#4} 转义</a></li>
|
||
<li><a href="#55">5{#5} 引用</a></li>
|
||
<li><a href="#66">6{#6} 提纲</a><ul>
|
||
<li><a href="#6161">6.1{#6.1} 提纲号</a><ul>
|
||
<li><a href="#611611">6.1.1{#6.1.1} 提纲号示例</a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#77">7{#7} 注释</a><ul>
|
||
<li><a href="#7171">7.1{#7.1} 强注释</a></li>
|
||
<li><a href="#7272">7.2{#7.2} 弱注释</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#88">8{#8} 列表</a><ul>
|
||
<li><a href="#8181">8.1{#8.1} 有序列表</a></li>
|
||
<li><a href="#8282">8.2{#8.2} 无序列表</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#99">9{#9} 表格</a></li>
|
||
<li><a href="#1010">10{#10} 警告</a></li>
|
||
<li><a href="#1111-emoji">11{#11} Emoji</a></li>
|
||
<li><a href="#1212_1">12{#12} 扩展语法</a><ul>
|
||
<li><a href="#121121_1">12.1{#12.1} 警告</a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<h1 id="crossdown">CrossDown</h1>
|
||
<p>自制的markdown，添加了一些自定义的语法<br />
|
||
效果请见<a href="https://github.com/CrossDark/CrossDown/blob/main/README.html">README.html</a></p>
|
||
<h1 id="11">1{#1} 基本语法</h1>
|
||
<h2 id="1111">1.1{#1.1} 标题</h2>
|
||
<h1 id="_1">一级标题</h1>
|
||
<h2 id="_2">二级标题</h2>
|
||
<h3 id="_3">三级标题</h3>
|
||
<h4 id="_4">四级标题</h4>
|
||
<h5 id="_5">五级标题</h5>
|
||
<h6 id="_6">六级标题</h6>
|
||
<h2 id="1212">1.2{#1.2} 样式</h2>
|
||
<h3 id="121121">1.2.1{#1.2.1} <em>斜体</em></h3>
|
||
<h3 id="122122">1.2.2{#1.2.2} <strong>粗体</strong></h3>
|
||
<h3 id="123123">1.2.3{#1.2.3} <strong><em>粗斜体</em></strong></h3>
|
||
<h3 id="124124">1.2.4{#1.2.4} <u>下划线</u></h3>
|
||
<h3 id="125125">1.2.5{#1.2.5} <s>删除线</s></h3>
|
||
<h3 id="126126">1.2.6{#1.2.6} <mark>高亮</mark></h3>
|
||
<h3 id="127127">1.2.7{#1.2.7} <ruby>在文本的正上方添加一行小文本<rt>主要用于标拼音</rt></ruby></h3>
|
||
<h3 id="128128">1.2.8{#1.2.8} <span title="只有鼠标放在上面才会显示隐藏文本">在指定的文本里面隐藏一段文本</span></h3>
|
||
<h3 id="129129">1.2.9{#1.2.9} 分割线</h3>
|
||
<hr />
|
||
<hr />
|
||
<hr />
|
||
<h2 id="1313">1.3{#1.3} 链接</h2>
|
||
<h3 id="131131">1.3.1{#1.3.1} 普通链接</h3>
|
||
<p><a href="链接地址">链接文本</a></p>
|
||
<p><a href="https://crossdark.com">CrossDark</a></p>
|
||
<p><a href="https://crossdark.net/">https://crossdark.net/</a></p>
|
||
<h3 id="132132">1.3.2{#1.3.2} 图片</h3>
|
||
<p><img alt="链接图片" src="链接地址" /></p>
|
||
<p><img alt="sea" src="https://crossdark.com/wp-content/uploads/2024/05/1715259682-sea.jpg" /></p>
|
||
<h3 id="133133">1.3.3{#1.3.3} 变量链接</h3>
|
||
<p><a href="https://crossdark.com">链接文本</a></p>
|
||
<h1 id="22">2{#2} 变量</h1>
|
||
<h2 id="2121">2.1{#2.1} 定义</h2>
|
||
<p>{变量名} = 值</p>
|
||
<h2 id="2222">2.2{#2.2} 赋值</h2>
|
||
<p>{变量名} {锚点名}</p>
|
||
<p>提纲的编号已经自动配置为了锚点,可直接使用{2}</p>
|
||
<h2 id="2323">2.3{#2.3} 添加锚点</h2>
|
||
<p>{#锚点名}</p>
|
||
<h1 id="33">3{#3} 代码块</h1>
|
||
<h2 id="3131">3.1{#3.1} <code>单行</code></h2>
|
||
<h3 id="311311-latex">3.1.1{#3.1.1} LaTex</h3>
|
||
<p><code>$CO_2$</code></p>
|
||
<p><code>$H_2O$</code></p>
|
||
<h3 id="312312">3.1.2{#3.1.2} 函数</h3>
|
||
<p><code>¥y=x*2+1¥</code> // 不定义范围</p>
|
||
<p><code>¥y=x**2¥€-50,50€</code> // 定义了x范围</p>
|
||
<p><code>¥y=x**3¥€-50,50|-100,100€</code> // 定义了y范围</p>
|
||
<h2 id="3232">3.2{#3.2} 多行</h2>
|
||
<h3 id="321321-yaml">3.2.1{#3.2.1} YAML</h3>
|
||
<p><code>A:
|
||
1. a
|
||
2. b
|
||
3. c
|
||
B:
|
||
- a
|
||
- b
|
||
- c</code></p>
|
||
<h3 id="322322-python">3.2.2{#3.2.2} Python</h3>
|
||
<p><code>python
|
||
print('CrossDown')</code></p>
|
||
<h3 id="323323-mermaid">3.2.3{#3.2.3} Mermaid</h3>
|
||
<p><code>mermaid
|
||
graph LR
|
||
A-->B
|
||
A-->C
|
||
B-->D
|
||
C-->D</code></p>
|
||
<h1 id="44">4{#4} 转义</h1>
|
||
<p>\ </p>
|
||
<p>\a </p>
|
||
<p>*</p>
|
||
<h1 id="55">5{#5} 引用</h1>
|
||
<blockquote>
|
||
<p>一级引用</p>
|
||
<blockquote>
|
||
<p>二级引用</p>
|
||
<blockquote>
|
||
<p>三级引用</p>
|
||
<blockquote>
|
||
<p>四级引用</p>
|
||
<blockquote>
|
||
<p>五级引用</p>
|
||
<blockquote>
|
||
<p>六级引用</p>
|
||
</blockquote>
|
||
</blockquote>
|
||
</blockquote>
|
||
</blockquote>
|
||
</blockquote>
|
||
<p>引文内添加<em>斜体</em><strong>粗体</strong><u>下划线</u><s>删除线</s><mark>高亮</mark></p>
|
||
</blockquote>
|
||
<h1 id="66">6{#6} 提纲</h1>
|
||
<h2 id="6161">6.1{#6.1} 提纲号</h2>
|
||
<p>以数字和点组成,通过空格与提纲名分隔,例如:</p>
|
||
<h3 id="611611">6.1.1{#6.1.1} 提纲号示例</h3>
|
||
<p>点不能出现在开头或结尾,例如</p>
|
||
<p>.6.1.2 错误示范</p>
|
||
<p>6.1.3. 错误示范</p>
|
||
<p>不能出现两个及以上连续的点,例如:</p>
|
||
<p>6..1…4 错误示范</p>
|
||
<p>提纲号会被自动配置为锚点,可直接使用{6}{6.1}</p>
|
||
<h1 id="77">7{#7} 注释</h1>
|
||
<h2 id="7171">7.1{#7.1} 强注释</h2>
|
||
<p>|=<br />
|
||
无论如何都会被移除<br />
|
||
<code>放在代码块里也没用</code><br />
|
||
=|</p>
|
||
<h2 id="7272">7.2{#7.2} 弱注释</h2>
|
||
<!-- 这是注释 -->
|
||
|
||
<p>只有在 // 后面才会被移除</p>
|
||
<p><code>// 代码中的注释弱不会被移除</code></p>
|
||
<h1 id="88">8{#8} 列表</h1>
|
||
<h2 id="8181">8.1{#8.1} 有序列表</h2>
|
||
<ol>
|
||
<li>a</li>
|
||
<li>b</li>
|
||
<li>c</li>
|
||
<li>d</li>
|
||
</ol>
|
||
<h2 id="8282">8.2{#8.2} 无序列表</h2>
|
||
<ul>
|
||
<li>A</li>
|
||
<li>B</li>
|
||
<li>C</li>
|
||
<li>D</li>
|
||
</ul>
|
||
<h1 id="99">9{#9} 表格</h1>
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th style="text-align: center;">表头1</th>
|
||
<th style="text-align: center;">表头2</th>
|
||
<th style="text-align: center;">表头3</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td style="text-align: center;">单元格1</td>
|
||
<td style="text-align: center;">单元格2</td>
|
||
<td style="text-align: center;">单元格3</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: center;">单元格4</td>
|
||
<td style="text-align: center;">单元格5</td>
|
||
<td style="text-align: center;">单元格6</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h1 id="1010">10{#10} 警告</h1>
|
||
<div class="admonition 这是一条警告">
|
||
<p class="admonition-title">这是一条警告</p>
|
||
</div>
|
||
<h1 id="1111-emoji">11{#11} Emoji</h1>
|
||
<p>:person_biking:</p>
|
||
<p>:grinning_face_with_big_eyes:</p>
|
||
<h1 id="1212_1">12{#12} 扩展语法</h1>
|
||
<h2 id="121121_1">12.1{#12.1} 警告</h2>
|
||
<div class="admonition danger">
|
||
<p class="admonition-title">Don’t try this at home</p>
|
||
</div>
|
||
</body>
|
||
</html>
|