Dec 04, 2013 – 学习 & 提升 – 网页设计  jekyll   – Bai

RDiscount - Markdown for Ruby

RDiscount 是针对 Gruber 的 Markdown 语法利用 C 语言开发的一款快速转换程序，可将由 Markdown 语法书写的文本转换为 HTML 格式文档。它使用 Discount 处理程序来完成转换工作，在保留原 Markdown 语法特性的基础上，又增加了许多有用的新特性。

脚注

脚注由两部分构成：脚注标记和脚注内容，前者作为需进行脚注标注的文本的数字上标标记，后者则作为标注内容将以脚注列表的形式位于文档末尾处。

这是脚注示例[^1]。

[^1]: 这是脚注内容。

将转换为：

<p>这是脚注示例<sup id="fnref-1"><a href="#fn-1" class="footnote-ref">1</a></sup>。</p>

<div class="footnotes">
<hr />
<ol>

<li id="fn-1">
<p>这是脚注内容。
   <a href="#fnref-1" class="footnote-backref">&#8617;</a></p>
</li>

</ol>
</div>

效果为：

这是脚注示例1。

脚注可以出现在文档中任何位置，但是脚注标记和脚注内容将按照脚注出现的先后次序自动排序编号，同一个脚注内容不能有两个脚注标记位置，即脚注标记不能重复出现。

脚注标记可以不按数字顺序进行标记，而且脚注标记不仅可以是数字，也可以为字符（满足 HTML id 属性的合法字符）。脚注内容的位置无论位于文档的哪个位置，最终都会被转换到文档的底部。

脚注内容可以包含块级元素——段落、列表、引用等，和列表项包含块级元素相同，需要将相关块级元素缩进 4 个字符2。

在 jekyll 中使用脚注需要在 _config.yml 文件中插入以下代码：

markdown: rdiscount
rdiscount:
   extensions:
     - footnotes

表格

一个简单的表格实现如下：

First Header  | Second Header
------------- | -------------
Content Cell  | Content Cell
Content Cell  | Content Cell

其完全等价于：

| First Header  | Second Header |
| ------------- | ------------- |
| Content Cell  | Content Cell  |
| Content Cell  | Content Cell  |

第一行包含列标题，第二行包含强制分割行用于将标题和内容分割开，其后各行为表格的各行。列总是被管道符|隔开。以上代码转换为 HTML 为：

<table>
<thead>
<tr>
  <th>First Header  </th>
  <th> Second Header</th>
</tr>
</thead>
<tbody>
<tr>
  <td>Content Cell  </td>
  <td> Content Cell</td>
</tr>
<tr>
  <td>Content Cell  </td>
  <td> Content Cell</td>
</tr>
</tbody>
</table>

显示效果为：

First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

需要注意的是，表格的每一行中至少需要一个管道符，因此在创建单列表格时，要么在行首或行尾加上一个管道符，要么都加上。

可以使用冒号:来改变表格中列文本的对齐方式，当冒号位于强制分割行的右端时，列文本将右对齐；位于左侧时，则左对齐；当分割行两端都有冒号时则中间对齐。本质上对齐方式是利用 HTML 的align属性来完成的。

| Item      | Value |
| --------- |:-----:|
| Computer  | $1600 |
| Phone     |   $12 |
| Pipe      |    $1 |

显示效果为：

Item Value
Computer $1600
Phone $12
Pipe $1

单元格中的文本可以使用 Markdown 的行级（span-level）格式进行格式化。

| Function name | Description                    |
| ------------- | ------------------------------ |
| *help()*      | Display the help window.       |
| `destroy()`   | **Destroy your computer!**     |

显示效果为：

Function name Description
help() Display the help window.
destroy() Destroy your computer!

图片大小设置

设置格式为：

![alt文本](图片地址 =宽度x长度 "title文本")

其中图片的大小设置不能放到 title 文本的后面。

示例：

![GitHub Favicon](https://github.com/favicon.ico =16x16)

显示效果为：

GitHub Favicon

块级代码

RDiscount 支持围栏式（Fenced）的代码块：backtick-delimited、tilde-delimited，其特征是，可利用开始和结束围栏行（fence lines）而不是缩进将代码围起来。围栏行包含三个或者更多波浪线~或反引号`，而且开始行和结束行所使用的符号必须相同数量相等。需要注意的是，开始行的前面必须有空行，否则将转换为行内代码。结束行之后可以没有空行。例如：

~~~~~~~~~~~~~~~~~~~~~
int main() //这是代码行
~~~~~~~~~~~~~~~~~~~~~

等价于：

`````````````````````
int main() //这是代码行
`````````````````````

效果为：

int main() //这是代码行

利用围栏式代码块，可以在代码块的开始和结束处使用空行。而且更方便直接从其它编辑器中直接粘贴过来已经缩进好的代码。

但是，这种方法对以 HTML 标签开始（且前边不含空格）的代码不能正常显示。例如以下代码就无法正常显示：

~~~~~~~~~~~~~~~~~~~~~
<p>Hello, world!</p>
~~~~~~~~~~~~~~~~~~~~~

而以下两个代码块即可正常显示：

~~~~~~~~~~~~~~~~~~~~~
 <p>Hello, world!</p>
~~~~~~~~~~~~~~~~~~~~~

~~~~~~~~~~~~~~~~~~~~~
Start, <p>Hello, world!</p> End
~~~~~~~~~~~~~~~~~~~~~

因此，如果要输出以 HTML 标签开始的代码块，必须在 HTML 标签前面加上至少一个空格，或者直接用缩进形式的代码块。

注意：偶然发现如果使用 pygments 对代码块进行语法高亮显示，不需要任何特别的处理即可实现代码块原样输出显示，即不需要缩进也不需要围栏行，只需将代码块置入 

1 </code>和<code>
（以 c 代码为例）之间即可，如下：



1 #include &lt;stdio&gt;
2 
3 int main()
4 {
5    printf ("Hello, world!\n");
6    return 0;
7 }

将被转化为：

<div class="highlight"><pre><code class="c">
......
</code></pre></div>

显示效果为：

1 #include <stdio>
2 
3 int main()
4 {
5   printf ("Hello, world!\n");
6   return 0;
7 }

由于 

1 </code>和<code>
都是 liquid 代码，所以如果程序代码中含有 liquid 代码，则 liquid 代码被 Jekyll 作为 liquid 模板处理从而无法显示，此时需要利用 liquid 的 raw标签（）来暂时停止解析 liquid 模板。

段落居中

将段落文本置于->和<-之间即可实现居中对齐。

->这是段落居中对齐<-

将转换为：

<p style="text-align:center;">这是段落居中对齐</p>

显示效果为：

这是段落居中对齐

添加 HTML 中 class 和 id 的支持

  • class:name：将被转换为<span class="name">…</span>
  • id:name：将被转换为<a id="name">…</a>

但是经过测试，并不是按上面所说的进行转换，测试结果为：

[测试文字](class:red)
[测试文字](id:blue)

将被转换为：

<span class="red">测试文字</span>
<span id="blue">测试文字</span>

更多伪类的定义扩展可参见 Discount 主页。

Jekyll 中 RDiscount 可用的扩展

  • footnotes：支持脚注
  • smart：开启 SmartyPants 处理
  • aotulink：自动将 URL 地址转换为链接，即使 URL 地址没在尖括号内< >
  • no_image：不处理![ ]，并且从输出中移除所有<img>标签
  • no_links：不处理[ ]，并且从输出中移除所有<a>标签
  • ……

更多扩展信息参见 RDiscount 文档。

参考链接

  1. 这是脚注内容。↩

  2. 测试没成功！By: bai @ 2013/12/04 19:56:49↩

上一篇：

下一篇：

回顶部