侧边栏壁纸
博主头像
小亦日常 | XiaoY`s Blog博主等级

道阻且长，行则将至

  • 累计撰写 35 篇文章
  • 累计创建 46 个标签
  • 累计收到 16 条评论

目 录CONTENT

文章目录
科技&IT

【Halo插件-Stackedit】比较全的Markdown语法

XiaoY 小亦
XiaoY 小亦
2023-05-16 / 0 评论 / 0 点赞 / 76 阅读 / 21357 字
温馨提示：
本文最后更新于 2023-05-16，若内容或图片失效，请留言反馈。部分素材来自网络，若不小心影响到您的利益，请联系我们删除。

文本样式

  • 标题大小

  ###### 六级标题
  ##### 五级标题
  #### 四级标题
  ### 三级标题
  ## 二级标题
  # 一级标题

显示：

六级标题
五级标题

四级标题

三级标题

二级标题

一级标题

  • 字体颜色&大小

<!--以红色字体为例-->
<font color=red>红色字体</font>

<!--使用十六进制-->
<font color=#d85446>十六进制</font>

<!--字体大小-->
<font size=5>字体</font>
<font size=10>字体</font>

<!--字体-->
<font face="宋体">宋体</font>
<font face="楷体">楷体</font>

<!--
字体背景颜色
-
由于 style 标签和标签的 style 属性不被支持，
所以这里只能是借助 table, tr, td 等表格标签的 bgcolor 属性来实现背景色。
这里对于文字背景色的设置，只是将那一整行看作一个表格，更改了那个格子的背景色（bgcolor）
-
引用自知乎：https://zhuanlan.zhihu.com/p/139007418
-->

<table><tr><td bgcolor=green>绿色</td></tr></table>

<!--可搭配<font>使用-->

<table><tr><td bgcolor=green><font color=white>白色字体绿色背景</font></td></tr></table>

显示： 红色字体 十六进制 字体 字体 宋体 楷体

绿色
白色字体绿色背景

  • 字体样式

//斜体
<i>斜体</i>
_斜体_

//下划线
<u>下划线</u>

//删除线
~~删除线~~

//粗体
**粗体**

//粗体&斜体
***粗体&斜体***

显示： 斜体 斜体 下划线 删除线 粗体 粗体&斜体

  • 文本位置

<!--居中-->
<center>这是居中的文本</center>
<div align=center>这是居中的文本</div>

<!--左对齐-->
<div align=left>这是左对齐文本</div>

<!--右对齐-->
<div align=right>这是右对齐文本</div>

显示：

这是居中的文本
这是居中的文本
这是左对齐文本
这是右对齐文本

表格

//正常表格
 商品 | 价格 |
-|-|
 铅笔 | ￥2 |
 练习册 | ￥4 |
 橡皮 | ￥2 |

//左对齐&居中&右对齐
 左对齐 | 居中 | 右对齐 |
 :-|:-:|-:|
 文本 | 文本 | 右对齐  |

//使用<table>标签，tr为表格行，th为表头，td为表格单元
<table>
<tr>
<th>表头1</th>
<th>表头2</th>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<table>

//<table>表格的位置可以用align属性定义
//right为右边，left为左边，center居中
//单元格内容位置在tr里定义align属性
<table align="center">
<tr>
<th>表头1</th>
<th>表头2</th>
</tr>
<tr>
<td align="center">内容1</td>
<td>内容2</td>
</tr>
<table>

//<table>表格的colspan可以合并单元格
//比如合并两个单元格，colspan="2"
//合并列使用rowspan属性，使用方法同上
//<table>表格的border属性可以设置边框
//比如 border=1
<table border=1>
<tr>
<th>表头1</th>
<th colspan="2">合并的单元格</th>
</tr>
<tr>
<td rowspan="2">内容1</td>
<td>内容2</td>
<td>内容3</td>
</tr>
<tr>
<td>内容2</td>
<td>内容3</td>
</tr>
<table>

显示： 商品 | 价格 | -|-| 铅笔 | ￥2 | 练习册 | ￥4 | 橡皮 | ￥2 |


左对齐居中右对齐
左对齐左对齐左对齐居中居中居中右对齐右对齐右对齐

表头1 表头2
内容1 内容2

表头111111111 表头222222222 表头333333333
向左 居中 向右

表头1 合并的单元格
合并的单元格 内容2 内容3
内容2 内容3

图片

  • 表示方法

  <img src="https://dl.fengsweb.top/s/k922gm" />
  <!--除以上表示方法外，还可以用：![图片alt属性](url)来表示-->
  ![小亦日常logo](https://dl.fengsweb.top/s/k922gm)

显示：

小亦日常logo

  • 图片大小

  <img src="https://dl.fengsweb.top/s/k922gm" width=40%/>

<!--后面的=200x200，可以只写一个参数比如=200x-->
![小亦日常logo](https://dl.fengsweb.top/s/k922gm =200x200)

显示： ![小亦日常logo](https://dl.fengsweb.top/s/k922gm =200x)

  • 图片位置

<!--和文本位置一样-->
<center>
    <img src="https://dl.fengsweb.top/s/k922gm" width=40%/>
</center>

<div align=center>
    <img src="https://dl.fengsweb.top/s/k922gm" width=40%/>
</div>

<div align=left>
    <img src="https://dl.fengsweb.top/s/k922gm" width=40%/>
</div>

<div align=right>
    <img src="https://dl.fengsweb.top/s/k922gm" width=40%/>
</div>

显示：

  • 图片并排显示

<table><tr>
  <td><img src="https://dl.fengsweb.top/s/k922gm" width="300" border=0 /></td>
  <td><img src="https://dl.fengsweb.top/s/k922gm" width="300" border=0 /></td>
  <td><img src="https://dl.fengsweb.top/s/k922gm" width="300" border=0 /></td>
</tr></table>

显示：

代码块

//使用```来定义代码块
print("Helle world!")

//还可以指定语法，比如
```c
#include  <stdio.h>
int  main(){
  /* 我的第一个 C 程序 */
  printf("Hello, World! \n");
  return  0; 
}
```
//也可以缩进4个空格或者一个制表符
    print("hello")
    print("hello")

显示：

print("Helle world!")

#include  <stdio.h>

int  main(){
  /* 我的第一个 C 程序 */
  printf("Hello, World! \n");
  return  0; 
}

print("hello")
print("hello")

链接

<a href="https://blog.fengsweb.top">小亦日常</a>
<!--要在新标签页打开可以加上 target="_blank"-->
<a href="https://blog.fengsweb.top" target="_blank">小亦日常</a>

<!--[标题](url "alt")-->
[小亦日常](https://blog.fengsweb.top "小亦日常|分享有趣知识")

<!--如果不需要标题可以写成<url>-->
<https://blog.fengsweb.top>

<!--使用变量-->
[1]:https://blog.fengsweb.top
[rdwa]:https://4399.com
[小亦日常][1]
[4399小游戏][rdwa]

显示： a标签小亦日常 小亦日常，新标签页 小亦日常 https://blog.fengsweb.top

小亦日常 4399小游戏

列表

  • 有序列表

  
  <!--使用数字+.+空格-->
1. 111
2. 222
3. 333

<!--html语法-->

<ol>
    <li>111</li>
    <li>222</li>
    <li>333</li>
</ol>

显示：

  1. 111
  2. 222
  3. 333
  1. 111
  2. 222
  3. 333

  • 无序列表

  
  <!--使用-+空格-->
- aaa
- bbb
- ccc
  
  <!--html语法-->
  
  <ul>
    <li>ddd</li>
    <li>eee</li>
    <li>fff</li>
  </ul>

显示：

  • aaa
  • bbb
  • ccc
  • ddd
  • eee
  • fff

  • 列表嵌套

1. 食物
   1. 面包
   2. 三明治
   3. 烤肠
2. 饮品
   1. 牛奶
   2. 橙汁
   3. 咖啡

显示：

  1. 食物
    1. 面包
    2. 三明治
    3. 烤肠
  2. 饮品
    1. 牛奶
    2. 橙汁
    3. 咖啡

分隔线

<!--注意：使用分隔线上下都要空一行-->
<!--使用减号-->

---

<!--使用星号-->

***

显示：

注脚

<!--使用 ^[注脚内容]-->
markdown^[Markdown是一种轻量级标记语言，排版语法简洁，让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档，可与HTML混编，可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写，Markdown被大量使用，如Github、Wikipedia、简书等。]

C语言^[C 语言是一种通用的、面向过程式的计算机程序设计语言。1972 年，为了移植与开发 UNIX 操作系统，丹尼斯·里奇在贝尔电话实验室设计开发了 C 语言。]

显示： markdown^[Markdown是一种轻量级标记语言，排版语法简洁，让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档，可与HTML混编，可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写，Markdown被大量使用，如Github、Wikipedia、简书等。] C语言^[C 语言是一种通用的、面向过程式的计算机程序设计语言。1972 年，为了移植与开发 UNIX 操作系统，丹尼斯·里奇在贝尔电话实验室设计开发了 C 语言。]

拼音

# windows的微软输入法可以使用 uuzm 来打出声调
<ruby>
你<rp>(</rp><rt>nǐ</rt><rp>)</rp>
好<rp>(</rp><rt>hǎo</rt><rp>)</rp>
我<rp>(</rp><rt>wǒ</rt><rp>)</rp>
是<rp>(</rp><rt>shì</rt><rp>)</rp>
小<rp>(</rp><rt>xiǎo</rt><rp>)</rp>
亦<rp>(</rp><rt>yì</rt><rp>)</rp>
</ruby>

显示： 你(nǐ) 好(hǎo) 我(wǒ) 是(shì) 小(xiǎo) 亦(yì)

上下标

<!-- 上标用^内容^，下标用~内容~ -->
上标：2^2^
下标：2~2~

显示： 上标：2^2^ 下标：2~2~

引用

  • 正常引用

  <!--使用>来引用-->
  > 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.
  > 
  > Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
  > id sem consectetuer libero luctus adipiscing.

显示：

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. Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

  • 引用嵌套

  > 第一层
  >> 第二层
  >>> 第三层

显示：

第一层

第二层

第三层

表情Emoji

因为表情实在是太多了，这里小亦单独整理了一个页面，有需要的小伙伴可以浏览一下：小亦日常 - Emoji代码 放上官网指定的表情符号简码列表

特殊符号

引用自 CSDN | # Markdown常用特殊符号

符号说明对应编码(使用时去掉空格)英文怎么说
&AND 符号& amp;ampersand
<小于& lt;little
>大于& gt;great
空格& nbsp;number space
¿倒问号& iquest;inverted question
?问号& quest;question
«左书名号& laquo;left angle quote
»右书名号& raquo;right angle quote
"引号& quot;quote
‘左单引号& lsquo;left single quote
’右单引号& rsquo:right single quote
“左双引号& ldquo:left double quote
”右双引号& rdquo:right double quote
段落符号& para;paragraph
§章节符& sect;section
×乘号& times;times
÷除号& divide;divide
±加减号& plusmn;plus minus
ƒfunction& fnof;还没查到
√根号& radic;radic
∞无穷大& infin;infinite
°度& deg;degree
≠不等号& ne;ne
≡恒等于& equiv;equivalent
≤小于等于& le;less than or equal to
≥大于等于& ge;great than or equal to
⊥垂直符号& perp;perpendicular
←左箭头& larr;left arrow
→右箭头& rarr;right arrow
↑上箭头& uarr;up arrow
↓下箭头& darr;down arrow
↔水平箭头& harr;horizontal arrow
↕竖直箭头& varr;vertical arrow
⇐双线左箭头& lArr;left arrow
⇒双线右箭头& rArr;right arrow
⇑双线上箭头& uArr;up arrow
⇓双线上箭头& dArr;down arrow
⇔双线水平双箭头& hArr;horizontal arrow
⇕双线竖直箭头& vArr;vertical arrow
♠黑桃& spades;spades
♥红桃& hearts;hearts
♣梅花& clubs;club
♦方块& diams;diamonds
©版权& copy;copy right
®注册商标& reg;registration
™商标& trade;trade
¥人民币& yen;
€欧元& euro;euro
¢美分& cent;cent
£英磅& pound;pound
⊕& oplus;
½二分之一& frac12;fraction
¼四分之一& frac14;fraction
‰千分符号& permil;per mille
∴所以& there4;there fore
π圆周率& pi;
¹商标1& sup1;super 1
αalpha& alpha;alpha
βbeta& beta;beta
γgamma& gamma;gamma
δdelta& delta;delta
θtheta& theta;theta
λlambda& lambda;lambda
σsigma& sigma;sigma
τtau& tau;tau

任务列表

- [x] 喝热水
- [ ] 吃午饭
- [ ] 背单词

显示：

  • [x] 喝热水
  • [ ] 吃午饭
  • [ ] 背单词

还有一些表示方法比如数学公式、流程图没有提到，有兴趣的小伙伴可以自己上网查询实践

0
Markdwon
版权归属： XiaoY 小亦
本文链接： https://blog.fengsweb.top/archives/1684231606401
许可协议： 本文使用《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》协议授权

评论区