markdown居中_技巧篇：不一样的 Markdown 文档

技巧篇：不一样的 Markdown 文档

在开发过程中，我们需要书写 API 文档；在记录自己的想法和灵感的时候，我们也需要一个好用的方式去书写。在以前我们会使用富文本编辑或者Office或者WPS来书写文档，现在我们更多的选择是去使用Markdown格式去书写，简单明了，格式简单，更重要的是常用的笔记应用和开源软件开发文档都是使用的Markdown。

常用的 Markdown语法可以参考本篇内容

在本文中我想要分享的是在 Markdown中通过使用 CSS实现的一些不一样样式

居中展示

通常我们通过添加# 标题 来实现标题的突出显示，而有的时候我们想要居中显示该怎么办呢？

由于 Markdown语法就是基于 HTML标签来构建的页面样式，所以我们想当然的可以在 Markdown 文档中使用 HTML 和 CSS 样式

所以我们可以通过添加下面的代码来实现居中内容展示

<p align="center">
  居中展示
</p>

展示的效果如下

居中展示

添加折叠

在文档中，如果我们有一段内容简介和内容，我们可能想实现一个折叠框展示，通过使用 HTML 的details 和 summary能够实现这个效果。

通过在caniuse的网站中看到在大部分的浏览器中能够支持details 和 summary 标签都能够使用。

下面是具体的使用方法，我们把想要折叠的内容使用 details 包裹，把标题的内容放在summary标签中即可

<detail>
  <summary>Details</summary>
  Something small enough to escape casual notice.
</detail>

效果如下:

折叠状态

展开状态

代码样式

使用GitHub查看效果更佳，具体的detail文档我们可以查看MDN

更多内容

更多的内容请关注GitHub，知乎@大手印，或者关注我的公众号@全栈开发师，我会不定时分享一些全栈方向的开发内容，谢谢分享

http://weixin.qq.com/r/sEwnP3zERSE6rThc9xmi (二维码自动识别)