Typecho上的Markdown 编辑器语法指南
Markdown是一种纯文本格式的标记语言
优点：
1.因为是纯文本，所以只要支持Markdown的地方都能获得一样的编辑效果，可以让作者摆脱排版的困扰，专心写作。
2.操作简单。比如:WYSIWYG编辑时标记个标题，先选中内容，再点击导航栏的标题按钮，选择几级标题。要三个步骤。而 Markdown只需要在标题内容前加#即可
缺点：
1.需要记一些语法（当然，是很简单。五分钟学会）。
2.有些平台不支持 Markdown 编辑模式。
1.标题
在想要设置为标题的文字前面加#来表示
一个#是一级标题，二个#是二级标题，以此类推。支持六级标题。
注：标准语法一般在#后跟个空格再写文字。示例如下：
# 这是一级标题这是二级标题
这是三级标题
这是四级标题
·······
复制
这是一级标题
这是二级标题
这是三级标题
这是四级标题
...
2.字体
要加粗的文字左右分别用两个*号包起来
要倾斜的文字左右分别用一个*号包起来
要倾斜和加粗的文字左右分别用三个*号包起来
要加删除线的文字左右分别用两个~~号包起来
示例如下:
这是加粗的文字这是倾斜文字这是斜体加粗的文字这是加删除线的文字
复制
这是加粗的文字这是倾斜的文字这是斜体加粗的文字这是加删除线的文字
3.引用
我们可能希望对某段文字进行强调处理，Markdown提供了一个特殊符号>用于段首进行强调，被强调的文字部分将会高亮显示。引用也可以嵌套，如加两个 >> 三个>>> n个...
示例如下：
>这是引用的内容>>这是引用的内容
复制
这是引用的内容
这是引用的内容
4.分割线
三个或者三个以上的 - 或者*都可以。
示例如下：颜色有点浅，好像都差不多的
---*
复制
<hr/><hr/>5.图片或链接
添加图片或链接，引用图片和链接的唯一区别就是在最前方添加一个感叹号示例如下:
点击跳转至百度;">1.列表内容
2.列表内容
3.列表内容7.代码块
使用反引号
进行包裹即可。如果是行内代码引用，使用单个反引号进行包裹，整段代码用三个包裹，并在后面标记语言，很多人不知道怎么输入反引号。在英文模式下，找到键盘最左侧esc键下面的第一个键点击即可。示例如下</p><p style="overflow-wrap: break-word; margin-top: 0px; margin-bottom: 8px; padding: 0px; box-sizing: border-box; list-style: inherit; min-height: 24px; color: rgb(51, 51, 51); font-family: "pingfang SC", "helvetica neue", arial, "hiragino sans gb", "microsoft yahei ui", "microsoft yahei", simsun, sans-serif; font-size: 14px; white-space: pre-wrap; background-color: rgb(255, 255, 255);">行内代码</p><pre class="prism-token token line-numbers language-javascript" style="overflow-wrap: normal; box-sizing: border-box; list-style: inherit; padding: 1em 1em 1em 3.8em; color: rgb(204, 204, 204); background-color: rgb(80, 85, 107); border-radius: 3px; overflow: auto; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; word-spacing: normal; word-break: normal; line-height: 1.5; tab-size: 4; hyphens: none; min-height: 14px; position: relative; counter-reset: linenumber 0;"><!DOCTYPE HTML> 这是HTML ``HTML
<html class="no-js">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>编辑 Markdown 编辑器语法指南 - Flat tire - Powered by Typecho</title>
<meta name="robots" content="noindex, nofollow">
</body>
</html><?php $this->need('includes/hero.php'); ?> 这是PHP
`PHP<div class="All_Page_width">
<div class="All_Page_title">
#标签云 </div>
<?php $this->widget('Widget_Metas_Tag_Cloud', 'sort=count&ignoreZeroCount=1&desc=1&limit=50')->to($tags); ?>
<div class="Tags_Cloud">
<?php $this->content(); ?>
<?php if ($tags->have()) : ?>
<?php while ($tags->next()) : ?>
复制
8.插入表格
|、-、:之间的多余空格会被忽略，不影响布局。
默认标题栏居中对齐，内容居左对齐。
-:表示内容和标题栏居右对齐，:-表示内容和标题栏居左对齐，:-:表示内容和标题栏居中对齐。
内容和|之间的多余空格会被忽略，每行第一个|和最后一个|可以省略，-的数量至少有一个。
示例如下
name | 价格 | 数量
-|-|-香蕉 | $1 | 5 苹果 | $1 | 6 草莓 | $1 | 7
复制
name | 111 | 222 | 333 | 444 |
|---|---|---|---|---|
aaa | bbb | ccc | ddd | eee |
fff | ggg | hhh | iii | 000 |
name | 111 | 222 | 333 | 444:-: | :-: | :-: | :-: | :-:aaa | bbb | ccc | ddd | eee
fff | ggg| hhh | iii | 000
复制
9.空格和换行
和HTML语言一致， & nbsp;< /br >
你 好 （空格）</br>你
好 （换行）
复制
示例如下：
你 好 （空格）
你
好 （换行）
10.键盘按钮
使用 Ctrl+Alt+Del 重启电脑
使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑
复制
11.各种标签
11.1 进度条带有提示标签的进度条将设置了 .sr-only 类的 标签从进度条组件中移除 类，从而让当前进度显示出来
60%
代码
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
60%
</div></div>
复制
低百分比进度条
在展示很低的百分比时，如果需要让文本提示能够清晰可见，可以为进度条设置 min-width 属性
0%
2%
代码
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
0%
</div></div><div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em; width: 2%;">
2%
</div></div>
复制
根据情境变化效果
进度条组件使用与按钮和警告框相同的类，根据不同情境展现相应的效果。
40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete (danger)
代码
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
<span class="sr-only">40% Complete (success)</span>
</div></div><div class="progress">
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
<span class="sr-only">20% Complete</span>
</div></div><div class="progress">
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
<span class="sr-only">60% Complete (warning)</span>
</div></div><div class="progress">
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
<span class="sr-only">80% Complete (danger)</span>
</div></div>
复制
条纹效果
通过渐变可以为进度条创建条纹效果，IE9 及更低版本不支持。
40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete (danger)
代码
<div class="progress">
<div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
<span class="sr-only">40% Complete (success)</span>
</div></div><div class="progress">
<div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
<span class="sr-only">20% Complete</span>
</div></div><div class="progress">
<div class="progress-bar progress-bar-warning progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
<span class="sr-only">60% Complete (warning)</span>
</div></div><div class="progress">
<div class="progress-bar progress-bar-danger progress-bar-striped" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
<span class="sr-only">80% Complete (danger)</span>
</div></div>
复制
堆叠效果
把多个进度条放入同一个.progress 中，使它们呈现堆叠的效果。
35% Complete (success)
20% Complete (warning)
10% Complete (danger)
代码
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: 35%">
<span class="sr-only">35% Complete (success)</span>
</div>
<div class="progress-bar progress-bar-warning progress-bar-striped" style="width: 20%">
<span class="sr-only">20% Complete (warning)</span>
</div>
<div class="progress-bar progress-bar-danger" style="width: 10%">
<span class="sr-only">10% Complete (danger)</span>
</div></div>
复制
11.2可用的变体
用下面的任何一个类即可改变标签的外观
DefaultPrimarySuccessInfoWarningDanger
代码
<span class="label label-default">Default</span><span class="label label-primary">Primary</span><span class="label label-success">Success</span><span class="label label-info">Info</span><span class="label label-warning">Warning</span><span class="label label-danger">Danger</span>
复制
11.3 警告框
警告框组件通过提供一些灵活的预定义消息，为常见的用户动作提供反馈消息。
...
...
...
...
代码
<div class="alert alert-success" role="alert">...</div><div class="alert alert-info" role="alert">...</div><div class="alert alert-warning" role="alert">...</div><div class="alert alert-danger" role="alert">...</div>
复制
12文章段落内引入图标
<i class="iconfont icon-github"></i><i class="iconfont icon-weixin"></i> <i class="iconfont icon-aiqiyi"></i> <i class="iconfont icon-zhifubao"></i>
复制
13 文章段落symbol 引用
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-denglong"></use></svg>
复制
14 外链卡片调用
1.1. title：必填，外链的名称/标题
1.2. url：必填，外链的地址（请填写绝对地址，就是浏览器地址栏什么样的就填什么样的）
1.3. intro：（可选）外链网站的简介/介绍
1.4. cover：（选填）外链网站的介绍图片地址
代码
[ post url="https://www.ihewro.com" title="友人C" intro="一个个人博客" cover="https://**.png" / ]
复制
15标签tag
默认白色文字
紫色文字
蓝色文字
黄色文字
红色文字
绿色文字
黑色文字
代码
[tag]默认白色文字/tag紫色文字/tag蓝色文字/tag黄色文字/tag红色文字/tag绿色文字/tag黑色文字[/tag]
复制
16时间线
2020大事记
2020-1-20
武汉封城，疫情让一起变得慌乱起来
2020-3-20
开始远程办公，慢慢有序起来
生活变得好起来了
2020-10-1
国庆节去哈尔滨旅行，和老同学见面
代码
timeline title="2020大事记" type="small" start="梦开始的地方" end="新的一年开始" 武汉封城，疫情让一起变得慌乱起来 /item 开始远程办公，慢慢有序起来/item生活变得好起来了/item 国庆节去哈尔滨旅行，和老同学见面/item
复制
17计划表
计划表中包含了三种类型的任务：
check类型，该类型任务只有两种状态，完成和未完成
progress，该类型任务可以显示任务执行的进度，需要手动填写进度
start、end，该类型任务设置一个起始时间和终止时间，进度会根据当前时间自动更新进度
时间格式：必须是正确的时间格式，比如2021-01-02 12:00 ，也可以只写日期2021-01-02
2021的小目标
每天早睡
每天早起
阅读10本书 ：
50%每天锻炼30分钟 ：
346%
代码
goal title="2021的小目标" 每天早睡 /item 每天早起 /item 阅读10本书 /item 每天锻炼30分钟 /item
复制
18视频播放器
有两款代码可以实现
效果1：不能全屏
代码
<iframe align="center" width="100%" height="500px" src="https://bili.sangxuesheng.com/player/?url=（视频链接）"frameborder="no" border="0" scrolling="no"marginwidth="0" marginheight="0" ></iframe>
复制
效果2： 可以全屏
代码
<iframe src="https://bili.sangxuesheng.com/player/?url=(视频链接)" allowfullscreen="allowfullscreen" mozallowfullscreen="mozallowfullscreen" msallowfullscreen="msallowfullscreen" oallowfullscreen="oallowfullscreen" webkitallowfullscreen="webkitallowfullscreen" width="100%" height="500px" frameborder="0"></iframe>
复制
可以解析bilibi
<iframe src="https://jx.parwix.com:4433/player/?url=(视频链接)" allowfullscreen="allowfullscreen" mozallowfullscreen="mozallowfullscreen" msallowfullscreen="msallowfullscreen" oallowfullscreen="oallowfullscreen" webkitallowfullscreen="webkitallowfullscreen" width="100%" height="500px" frameborder="0"></iframe>
复制
19视频播放器
方法1
代码
[vplayer url="http://xxx.com/xxx.mp4"; pic="http://xxx.com/xxx.png";]
![http://xxx.com/xxx.png"](http://xxx.com/xxx.png"){kind=link}
复制
方法2
默认使用的第三方云解析视频地址 https://okjx.cc/?url=，支持b站、爱奇艺、优酷等常见平台
正在播放：抱歉 Louis C.K.: Sorry (2021)
剧集列表
抱歉 Louis C.K.: Sorry (2021) 一根弦
代码
vplayer status="true"Video url="https://www.bilibili.com/video/BV1RL4y1J7wJ"; title="一根弦" /
复制
20挂载bilibili
<div class="video"><iframe src="//player.bilibili.com/player.html?aid=657099346&bvid=BV1Lh4y1R798&cid=1158402282&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe></div>
复制
部分内容引用自爆胎
<br/>