Markdown 使用

发表： 分类： 本文字数： 1.6k 阅读时长 ≈ 1 分钟

1、代码增减标识

代码块中有代码增减替换时，着色标识，格式如下：

1
2
3
4
```diff
+ 增加
- 删减
``'

效果如下：

1
2
+ 增加
- 删减

2、代码块折叠

当文章中添加代码过长时，会对文章的阅读和显示造成不好的体验，折叠代码块是一种很好的解决方式
书写格式：

1
2
3
4
<details>
  <summary>标题</summary>
	详细内容
</details>

原理：采用 HTML5 中的新标签，因此这不能算是对 Next 主题的美化。
summary 标签作为 details 元素的标题，details 元素用于描述有关文档或文档片段的详细信息。
与 details 一起使用,标题是可见的，当用户点击标题时会显示出详细信息。

缺点：兼容性不好，只有 Chrome 以及 Safari 6 支持 summary 标签。

效果如下：

点击显/隐代码 
1
2
3
4
5
6
7
8
9
10
<div class="site-author site-overview-item animated" itemprop="author" itemscope itemtype="http://schema.org/Person">
  {%- if theme.avatar.url %}
+    <a href="/">
      <img class="site-author-image" itemprop="image" alt="{{ author }}"
        src="{{ url_for(theme.avatar.url or theme.images + '/avatar.gif') }}">
+    </a>
  {%- endif %}
  <p class="site-author-name" itemprop="name">{{ author }}</p>
  <div class="site-description" itemprop="description">{{ description }}</div>
</div>

3、区块

效果：

区块引用
菜鸟教程
学的不仅是技术更是梦想

参考：Markdown区块语法

4、字体大小、颜色、居中

格式：

1
2
3
4
5
<font face="黑体">我是黑体</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>
<center>需要居中的字体</center>
<center><font color=red size=7 face="微软雅黑">我是居中的7号红色微软雅黑</font></center>

Size：规定文本的尺寸大小。值：从 1 到 7 的数字。

效果：

  • 我是黑体字
  • 我是微软雅黑
  • 我是华文彩云
  • 我是居中的7号红色微软雅黑