• 一些Markdown扩展语法


    相信很多人跟我一样,对Markdown是“一知半解”,会打一点,知道一点,但是其实从没花哪怕一分钟了解过。其实除了标题粗体插入代码,Markdown还有很多有趣的基础语法和扩展语法。

    Markdown基本语法就是由 John Gruber 最初设计的语法(如标题,加粗,斜体等),它很简单且很常用,但是功能相当有限。由于一直没有Markdown的确定标准,各个平台自制的“民间Markdown”应运而生,扩展语法增加了许多高级的功能(表格,角标等),可以实现更多功能。各个地方的扩展语法不尽相同。在一些网络平台或者本地编辑器上有效的语法,可能在其他地方并不能正确显示。不过对于一些最常见的扩展语法,各个地方还是大致统一的。

    表格(Tables)

    大家应该都用过自动生成的Markdown表格,事实上自己打也并不复杂。Markdown支持创建任意mxn表格,并且可以对每一列设置对齐方式

    |中国|美国|日本|韩国| 
    |-:|-|:-:|:-|
    |北京|华盛顿|东京|首尔|
    |`1450000000`|327000000|126300000|52000000|
    
    中国 美国 日本 韩国
    北京 华盛顿 东京 首尔
    1450000000 327000000 126300000 52000000

    一个mxn表格由m+1行构成,其中第一行是表头,第二行指定对齐方式(Alignment),之后所有的行是剩余的行。每一行由n+1个分隔符|分割为n格,每一格储存该列的信息。不同列的长度可以不同,无需对齐,这一列会自动调整宽度,完整显示一列里最宽的数据。列里的数据也支持简单的语法

    上面的代码创建了一个3x4的表格。观察第二行的对齐方式。可以发现:

    • ---:表示向右对齐(-可以有任意多个,下同)
    • :--:表示向中对齐
    • :----(即默认值)表示向左对齐

    列表,引用的嵌套(Nested List & Quotation)

    不算扩展的语法,但是很有意思。Markdown中有序或无序列表的嵌套规则是以缩进(Indent)来决定

    1. First
       - Indent1
       - Indent2
    2. Second
       1. Indent1
       2. Indent2
    
    1. First
      • Indent1
      • Indent2
    2. Second
      1. Indent1
      2. Indent2

    实际上,要在任何列表间插入其他内容,都可以不用打断列表,在列表的两项之间缩进就可以,列表的顺序和结构是完全由缩进来决定的

    1. First
       > Quotation in First
    2. Second
    
    1. First

      Quotation in First

    2. Second

    而引用的嵌套只有大于号的个数决定,几个大于号就是几层嵌套,甚至一级引用里可以直接出现三级引用。同一级引用会在引用框左边自动连接。

    > line1
    > > line2
    > > > line3
    > 
    > line4
    > line5
    > > > line6
    

    line1

    line2

    line3

    line4
    line5

    line6

    注意引用内的文字也需要多打一个回车才能分开,否则可能会显示在一行(这里没有)。

    还有一种形式的列表:

    First
    : First
    
    Second Term
    : Second
        : Thrird
    : Fourth
    
    First
    First
    Second
    Second
    Thrird
    Fourth

    这个是在markdown.com.cn)上看到的,我本机并不支持,博客园可以预览,但像上面一样炸了,其嵌套规则也是看缩进。不过这个东西描述为“定义列表”,应该用来做定义,并不应该用来嵌套。

    删除线、高亮线与转义表示(Strickout, Highlight and Escape)

    ~~这是删除~~这是删除

    ==这是高亮==这是高亮

    删除线还算常见,但是高亮很多地方并不支持(但是博客园支持)。要在删除线内使用~字符,使用转义字符\~即可。

    ~~这是\~\~删除~~这是~~删除

    对于加粗或者斜体也是一样,用\*替代*

    **ds\*\*ad**ds**ad

    但是行内代码字符`并不支持这么做,你可以自己进行尝试,即使进行转义,它往往也会优先匹配最近的两个`,留下空空一个\

    `\`and` 显示效果:\and`。

    正确的做法:如果行内代码里出现`,就把两端的一个反引号改为两个:``(当然要加上空格,不要连在一起)。那如果行内代码里也出现了两个`呢?那就把两端的两个改为三个,以此类推。

    `` ` ``显示效果:`

    ``` `` ```显示效果:``(那我是怎么打出三重反引号的?那就在边上加4个了)

    链接(HyperLink),图片(Picture)与Title

    一般的链接是这样[一般的链接是这样](https://www.cnblogs.com/ofnoname/p/15823373.html)

    在链接后可以添加一个字符串作为Title[在链接后可以添加一个字符串作为Title](https://www.cnblogs.com/ofnoname/p/15823373.html "Hello?Hello!")

    这样,当你把鼠标移至添加了Title的链接而不点击时,鼠标旁就会显示出Title。图片也是一个道理,可以在鼠标指向图片时显示Title。

    直接链接:

    将链接直接用<>括起来即可,不过有些网站不能正确识别

    <https://www.cnblogs.com/ofnoname/p/15823373.html>https://www.cnblogs.com/ofnoname/p/15823373.html

    引用链接:

    将链接放在之后的引用里,在链接处只用数字代表

    [Click Me][1]
    
    [1]: https://www.cnblogs.com/ofnoname/p/15823373.html
    

    Click Me

    同时,这个链接也可以用来指向文中其他位置(定位到其他标题),最常见的就是标题标签的跳转,但是我在博客园测试出来不支持,所以就不再多讲。

    给图片增加链接:

    让图片变成可点击的,实现方法很多。其中一种是直接将两个链接暴力嵌套

    [ ![这里没有用](https://images.cnblogs.com/cnblogs_com/ofnoname/2093418/o_220119134611_1.jpg "不可以色色") ](https://www.cnblogs.com/ofnoname/p/15823373.html)
    

    这里没有用

    脚注(Footnote)

    上面的“引用链接"已经提到过一点了。真正的脚注用[^1]类似来标记

    悔相道之不察[^1]兮,延伫乎吾将反[^3]
    
    [^1]: Footnote 1
    [^3]: Footnote 2
    

    悔相道之不察[1]兮,延伫乎吾将反[2](点击链接跳转到文尾)

    可以使用任意标记关联脚注,会自动以1,2,3...排列。

    待办列表(Todolist)

    格式简单,无序列表加上一个框。

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

    框里的x表示已完成,否则未完成。一般可以手动点击更改。博客园不支持,大部分地方没有。Typora等本地编辑器有,非常美观。

    添加Emoji

    Emoji本质是Unicode字符,你可以直接复制表情然后粘贴在文本里(当然同一个符号在不同平台上有不同风格的,样式可能不一样,但是都是同一个表情)。不过在博客园,粘贴图片表情都会自动上传图片过后粘贴图片链接,很方便。

    附魔怔笑image

    更通用的办法是使用:表情代码:的形式。在emojipedia上可以查询各种的表情的显示以及短代码,常见的都可以被识别

    :sweat_smile:
    :joy:
    

    不过这个仍然比较小众,很多地方没有。

    自动目录(TOC)

    输入[TOC]召唤下面的目录(全文目录,标题等级动态生成的),比较常见。

    流程图(Flowchart)

    很多笔记软件都支持的流程图。具体实现是在代码框中使用flowchart或者mermaid。这样代码区域就会自动绘制流程图。

        ```flow或者mermaid
        //代码
        ```
    

    代码里可以定义各种图形,文字以及其连接方式。除了一般的流程图,有的还可以做时序图等等。不过博客园是不支持的,并且我也很难用习惯,这里不多做介绍。给大家贴一篇别的文章,描述流程图内的语法。


    1. Footnote 1 ↩︎

    2. Footnote 2 ↩︎

  • 相关阅读:
    nginx命令
    linux 命令
    js导出excel页面数据
    Linux上使用shell脚本查看内存情况(超实用)
    Gson解析json繁杂数据
    纯js制作遮罩层对话框
    简易树形菜单(可伸缩)
    一句实现jquery导航栏
    沁园春-雪
    python day3 int,str,list类型补充
  • 原文地址:https://www.cnblogs.com/ofnoname/p/15823373.html
Copyright © 2020-2023  润新知