markdown基本语法（GITHUB+HEXO搭建的博客）

网上有很多markdown语法的文章，详情可以点击简书上的一篇文章markdown基本语法
以下列出一些常用的markdown语法
补充说明：md文件中可以直接使用html标签

一、标题

在想要设置为标题的文字前面加#来表示
一个#是一级标题，二个#是二级标题，以此类推。支持六级标题。
注：标准语法一般在#后跟个空格再写文字
示例：

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

效果如下：

这是一级标题

这是二级标题

这是三级标题

这是四级标题

这是五级标题

这是六级标题

从这里的效果可以看出，在这个页面显示与简书的那个不一样，从二级标题开始有分隔线，而且五、六级标题文字大小相同，六级标题是斜体标题
四级标题会将英文小写自动转为大写（css样式问题，已修复）

二、字体

• 斜体
  要倾斜的文字左右分别用一个*号包起来
• 加粗
  要加粗的文字左右分别用两个*号包起来
• 斜体加粗
  要倾斜和加粗的文字左右分别用三个*号包起来
• 删除线
  要加删除线的文字左右分别用两个~~号包起来
  示例：

  *这是倾斜的文字*
  **这是加粗的文字**
  ***这是斜体加粗的文字***
  ~~这是加删除线的文字~~

  效果如下：

这是倾斜的文字
这是加粗的文字
这是斜体加粗的文字
这是加删除线的文字

三、分隔线

三个或者三个以上的 - 或者 * 都可以。
示例：

---
----
***
*****

效果如下：

---

---

---

---

可以看到，显示效果是一样的。
补充一下，在我的文章里经常出现more的选项，这个代码其实很简单。
示例如下：

<!--more-->

效果无法展示~

四、图片

语法：

![图片alt](图片地址 ''图片title'')
第一个图片alt就是显示在图片下面的文字，相当于对图片内容的解释。（图片加载失败后的提示文字）
第二个图片title是图片的标题，当鼠标移到图片上时显示的内容。title可加可不加

注意：图片路径中不可以出现空格字符，在hexo4.0版本中图片显示不出来
示例：

![blockchain](https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=702257389,1274025419&fm=27&gp=0.jpg "区块链")

效果如下：

与简书的那个页面对比可以知道blockchain在图片下面是不能显示的（图片加载失败会显示），所以在这里面的语法可以简写如下

![](图片地址 "图片title")
title可加可不加

补充：上传本地图片，推荐一个网站，点击小贱贱图床
在这个网站可以免费上传自己的图片，也可以直接在百度上搜索图床，会出现很多的相关网站

两张图片在一行显示

语法：
markdown语法其实就是简化版html代码，直接用div和img标签控制两张图片在一行显示
示例：

<div><img width=50% src ="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/
u=702257389,1274025419&fm=27&gp=0.jpg"/><img width=50% src ="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/
u=702257389,1274025419&fm=27&gp=0.jpg"/></div>

效果如下：

图片居中显示

语法：
运用div标签控制图片居中显示
示例：

<div align="center"><img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/
u=702257389,1274025419&fm=27&gp=0.jpg" /></div>

效果如下：

五、网站链接

语法：

[网站名](网站链接地址 "网站title")
title即鼠标悬停显示title,可加可不加，网站是在新页面打开

示例：

[百度](https://www.baidu.com "百度")
[歌曲大全-音乐聚合搜索引擎](http://www.gequdaquan.net/gqss/)

效果如下：
百度
歌曲大全-音乐聚合搜索引擎

六、列表

无序列表

语法：
无序列表用 - + * 任何一种都可以

- 列表内容
+ 列表内容
* 列表内容
注意：- + * 跟内容之间都要有一个空格

效果如下：

• 列表内容

• 列表内容

• 列表内容

有序列表
语法：
数字加点
注：序列.后保持空格

1. 列表内容
2. 列表内容
3. 列表内容

效果如下：

1. 列表内容
2. 列表内容
3. 列表内容

序表嵌套
示例：

1. one
    1. one-1
    2. one-2
2. two 
    * two-1
    * two-2

效果如下：

1. one
   1. one-1
   2. one-2
2. two
   • two-1
   • two-2

---

补充说明：
当有序列表嵌套无序列表时，无序列表占用有序列表一个数字（css样式问题，已修复）
示例：

1. one
    * one-1
    * one-2
2. two

效果如下：

1. one
   • one-1
   • one-2
2. two

从中可以看出，有序列表2. two变为了4. two，嵌套了两个无序列表，占用了两个数字。有序列表嵌套有序列表没有此影响。

七、引用

文字引用
在引用的文字前加>即可。引用也可以嵌套，如加两个>>三个>>>
n个…
示例：

>这是引用的内容
>>这是引用的内容
>>>>>>>>>>这是引用的内容

效果如下：

这是引用的内容

这是引用的内容

这是引用的内容

代码引用

• 代码块
  语法：代码块开头结尾加三个反引号
  示例：

  ```
  <div>   
      <div></div>
      <div></div>
      <div></div>
  </div>
  ``` 

  效果如下：

  <div>   
      <div></div>
      <div></div>
      <div></div>
  </div>

• 单行代码
  语法：
  单行代码：代码之间分别用一个反引号包起来
  示例:

  `<div></div>`

  效果如下：
  <div></div>
  总结：在这个页面上有的语法预览与简书页面不同，相同的标签在不同的主题中也不一样（主题中对标签样式进行了定制）。创建这个页面发现了一个问题，在多次应用三个反引号语法时，如果出现两个内容连在了一起，这个可能需要换行解决。
  以上是我经常写文章所应用的语法，不是很全，后续可能还会更新

---

八、文字

文字首行缩进

中文缩进：一个 缩进一个文字（貌似不推荐使用）
示例：

  你好！

效果如下：
  你好！

文字居中

语法：
运用center标签
示例：

<center>这是居中的文字</center>

效果如下：

这是居中的文字

文字颜色

语法：
运用font标签
示例：

<font color='red'>红色文字</font>

效果如下：
红色文字

九、表格

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

|名|类型|长度|
|:-:|:-:|:-:|
|id|int|11|
|name|varchar|255|
|value|int|11|

注：若出现的是代码，在代码上面加上分隔线字符（或换行）
效果如下：

名	类型	长度
id	int	11
name	varchar	255
value	int	11

好啦，本篇文章到此就结束啦，不定期更新~

文章作者: akbcd

文章链接: https://akbcd.github.io/2018/10/28/markdown基本语法（GITHUB+HEXO搭建的博客）/

版权声明: 本博客所有文章除特別声明外，均采用 CC BY 4.0 许可协议。转载请注明来源 akbcd !