基础语法

...About 10 minNotesMarkdownStudy

基础语法

前言：自从接触了markdown编辑器之后，一发不可收拾，看着自己的整理的笔记都特别赏心悦目。目前文档都是用markdown来写的,个人电脑用的是typora这个软件。markdown的语法其实并不难，花点心思，多敲几下就能上手，本篇是我自己使用过程中整理的一些语法，内容较多，有需要的同学可以自行收录，后续如果有新的比较好用的语法也会更新在本篇随笔。

字体样式

Markdown 可以使用以下几种字体：

这是正常文字
*这是倾斜文字*
_这是倾斜文字_
**这是加粗文字**
__这是加粗文字__
***这是倾斜加粗文字***
___这是倾斜加粗文字___
~~这是删除线文字~~
<u>这是下划线文字</u>
$\underline{\text{这是下划线文字}}$

显示结果如下：
这是正常文字
这是倾斜文字
这是倾斜文字
这是加粗文字
这是加粗文字
这是倾斜加粗文字
这是倾斜加粗文字
~~这是删除线文字~~
这是下划线文字
$\underline{\text{这是下划线文字}}$

字体、字号、颜色

Markdown是一种可以使用普通文本编辑器编写的标记语言，通过类似HTML的标记语法，它可以使普通文本内容具有一定的格式。

<font size="1" color="#F4A460" face="黑体">我是黑体字</font>
<font size="2" color="#FF6347" face="宋体">我是宋体字</font>
<font size="3" color="#D8BFD8" face="楷体">我是楷体字</font>
<font size="4" color="#008080" face="微软雅黑">我是微软雅黑字</font>
<font size="5" color="#40E0D0" face="fantasy">我是fantasy字</font>
<font size="6" color="#00FF7F" face="Helvetica">我是Helvetica字</font>

显示结果如下：

分割线

你可以在一行中用三个或三个以上的星号(*)、减号(-)、底线(_)来建立一个分隔线，行内不能有其他东西。你也可以在星号或是减号中间插入空格。

***
* * *
****
---
___

显示结果如下：

区块引用

Markdown 区块引用是在段落开头使用 > 符号，然后后面紧跟一个空格符号：

> 区块引用
> 学的不仅是技术更是梦想

显示结果如下：

区块引用学的不仅是技术更是梦想

转义

Markdown 使用了很多特殊符号来表示特定的意义，如果需要显示特定的符号则需要使用转义字符，Markdown 使用反斜杠转义特殊字符：

**文本加粗** 
\*\* 正常显示星号 \*\*

显示结果如下：

文本加粗

** 正常显示星号 **

Markdown 支持以下这些符号前面加上反斜杠来帮助插入普通的符号：

**文本加粗** 
\   反斜线
`   反引号
*   星号
_   下划线
{}  花括号
[]  方括号
()  小括号
#   井字号
+   加号
-   减号
.   英文句点
!   感叹号

列表

无序列表

无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记：

* 第一项
* 第二项
* 第三项
------ 分割线 ------
+ 第一项
+ 第二项
+ 第三项
------ 分割线 ------
- 第一项
- 第二项
- 第三项

显示结果如下：

第一项
第二项
第三项 ------ 分割线 ------

第一项
第二项
第三项 ------ 分割线 ------

第一项
第二项
第三项

有序列表

有序列表使用数字并加上 . 号来表示，如：

1. 第一项
2. 第二项
3. 第三项

显示结果如下：

第一项
第二项
第三项

注意事项

在使用列表时，只要是数字后面加上英文的点，就会无意间产生列表，比如2017.12.30 这时候想表达的是日期，有些软件把它被误认为是列表。解决方式：在每个点前面加上转义符\就可以了。

2022\.9\.4 第一版

显示结果如下： 2022.9.4 第一版

列表嵌套

1. 第一项：
    - 第一项嵌套的第一个元素
    - 第一项嵌套的第二个元素
2. 第二项：
    - 第二项嵌套的第一个元素
    - 第二项嵌套的第二个元素

显示结果如下：

第一项：
第一项嵌套的第一个元素
第一项嵌套的第二个元素
第二项：
第二项嵌套的第一个元素
第二项嵌套的第二个元素

分级标题

写法一：

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

写法二：

一级标题
==

二级标题
--

标题编号

添加标题的自定义ID允许您直接链接到标题并使用CSS对其进行修改。要添加自定义标题ID，请在与标题相同的行上用大括号括起该自定义ID。

## My Great Heading {#greate-id}
HTML看起来像这样
<h3 id="greate-id">My Great Heading</h3>

链接到标题ID

通过创建带有数字符号（#）和自定义标题ID的链接，可以链接到文件中具有自定义ID的标题。

[emoji](./emoji.md#md)

显示结果如下： emoji

段落换行

Markdown 段落没有特殊的格式，直接编写文字就好，段落的换行是使用两个及以上空格加上回车。

Markdown 段落没有特殊的格式，直接编写文字就好  
段落的换行是使用两个及以上空格加上回车。

显示结果如下：

Markdown 段落没有特殊的格式，直接编写文字就好
段落的换行是使用两个及以上空格加上回车。

脚注

脚注是对文本的补充说明，Markdown 脚注的格式如下:

创建脚注格式类似这样 [^fly2you]。

[^fly2you]: 菜鸟教程 -- 学的不仅是技术，更是梦想！！！

演示效果如下：创建脚注格式类似这样 ^[1]。

图片

注意：这个图片描述可以不写。

插入本地图片和网上图片

![](./qr.jpg)
![这是本地图片](./qr.jpg)
![这是网上图片](https://platform-wxmall.oss-cn-beijing.aliyuncs.com/upload/20180708/qr.jpg)

显示结果如下：

这是本地图片这是网上图片

使用img标签

Markdown 还没有办法指定图片的高度与宽度，如果你需要的话，你可以使用img标签

<img src="https://platform-wxmall.oss-cn-beijing.aliyuncs.com/upload/20180708/qr.jpg" width="20%">

显示结果如下：

链接

markdown语法链接

[文档网站](http://doc.fly2you.cn)

显示结果如下：

文档网站open in new window

自动链接

Markdown 支持以比较简短的自动链接形式来处理网址和电子邮件信箱，只要是用<>包起来， Markdown 就会自动把它转成链接。

<http://doc.fly2you.cn>

显示结果如下：

http://doc.fly2you.cnopen in new window

禁用自动URL链接

如果您不希望自动链接URL，则可以通过将URL表示为带反引号的代码来删除该链接。

`http://www.example.com`

显示结果如下：

http://www.example.com

高级链接

链接也可以用变量来代替，文档末尾附带变量地址：

这个链接用 1 作为网址变量 [fly2you][1]
这个链接用 doc 作为网址变量 [doc][doc]

  [1]: http://fly2you.cn
  [doc]: http://doc.fly2you.cn

显示结果如下：

这个链接用 1 作为网址变量 fly2youopen in new window

这个链接用 doc 作为网址变量 docopen in new window

表格

Markdown 制作表格使用 | 来分隔不同的单元格，使用 - 来分隔表头和其他行。

|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |

显示结果如下：

表头	表头
单元格	单元格
单元格	单元格

设置表格对齐方式

-: 设置内容和标题栏居右对齐。
:- 设置内容和标题栏居左对齐。
:-: 设置内容和标题栏居中对齐。

| 左对齐 | 右对齐 | 居中对齐 |
| :-----| ----: | :----: |
| 单元格 | 单元格 | 单元格 |
| 单元格 | 单元格 | 单元格 |

显示结果如下：

左对齐	右对齐	居中对齐
单元格	单元格	单元格
单元格	单元格	单元格

代码块

单行代码

如果是单行代码或段落上的一个函数或片段的代码可以用反引号把它包起来（`），例如：

`System.out.println("Hello world""")`

显示结果如下： System.out.println("Hello world""")

代码区块

代码区块使用三个反引号对``` 包裹一段代码，并指定一种语言（也可以不指定）：

~~~ python
class CaseData:
"""这是一个存放测试用例数据的类"""
pass
~~~ 显示结果如下：

class CaseData:
    """这是一个存放测试用例数据的类"""
    pass

Markdown代码块支持语言

actionscript3
apache
applescript
asp
brainfuck
c
cfm
clojure
cmake
coffee-script, coffeescript, coffee
cpp - C++
cs
csharp
css
csv
bash
diff
elixir
erb - HTML + Embedded Ruby
go
haml
http
java
javascript
json
jsx
less
lolcode
make - Makefile
markdown
matlab
nginx
objectivec
pascal
PHP
Perl
python
profile - python profiler output
rust
salt, saltstate - Salt
shell, sh, zsh, bash - Shell scripting
sql
scss
sql
svg
swift
rb, jruby, ruby - Ruby
smalltalk
vim, viml - Vim Script
volt
vhdl
vue
xml - XML and also used for HTML with inline CSS and Javascript
yaml

任务列表语法

任务列表使您可以创建带有复选框的项目列表。在支持任务列表的Markdown应用程序中，复选框将显示在内容旁边。

- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

显示结果如下：

Write the press release
Update the website
Contact the media

支持HTML元素

对于 Markdown 涵盖范围之外的标签，都可以直接在文件里面用 HTML 本身。如需使用 HTML，不需要额外标注这是 HTML 或是 Markdown，只需 HTML 标签添加到 Markdown 文本中即可。

kbd

使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑

显示结果如下：使用 Ctrl+Alt+Del 重启电脑-

details

<details>
<summary>展开查看</summary>
减少重复造轮子，开源微信小程序商城（前后端开源：uniapp+Java），拼团、秒杀、优惠券、积分购物、直播卖货、分销等功能。快速搭建一个属于自己的微信小程序商城。QQ交流群：66502035、870579539、151602347欢迎大家进群交流技术。
</details>

显示结果如下：

展开查看

减少重复造轮子，开源微信小程序商城（前后端开源：uniapp+Java），拼团、秒杀、优惠券、积分购物、直播卖货、分销等功能。快速搭建一个属于自己的微信小程序商城。QQ交流群：66502035、870579539、151602347欢迎大家进群交流技术。

常用HTML标签

常用HTML标签	标签	一般格式为 <标签名> 文本 </标签名>	效果
换行	br	`<br/>`
加粗	b	`<b>加粗<b>`	加粗
斜体	i	`<i>斜体<i>`	斜体
下划线	u	`<u>u下划线</u>`	u下划线
删除线	del	`<del>删除线</del>`	~~删除线~~
加亮	mark	`<mark>加亮</mark>`	加亮
超链接	a	`<a href='链接地址'>超链接</a>`	超链接
文本下角	sub	`文本<sub>下角</sub>`	文本_下角
文本上角	sup	`文本<sup>上角</sup>`	文本^上角

使用 Emoji 表情

有两种方法可以将表情符号添加到Markdown文件中：将表情符号复制并粘贴到Markdown格式的文本中，或者键入emoji shortcodes。

复制和粘贴表情符号在大多数情况下，您可以简单地从Emojipedia 等来源复制表情符号并将其粘贴到文档中。许多Markdown应用程序会自动以Markdown格式的文本显示表情符号。从Markdown应用程序导出的HTML和PDF文件应显示表情符号。
使用表情符号简码一些Markdown应用程序允许您通过键入表情符号短代码来插入表情符号。这些以冒号开头和结尾，并包含表情符号的名称
查看表情符号简码

去露营了！ :tent: 很快回来。
真好笑！ :smile:

显示结果如下：

去露营了！ ⛺ 很快回来。真好笑！ 😄

菜鸟教程 -- 学的不仅是技术，更是梦想！！！ ↩︎