md入门使用
浮川的小窝

md入门使用

面壁人浮川
2021-05-14 发布 / 正在检测是否收录...

md.png

基本符号:* - +. >

基本上所有的markdown标记都是基于这四个符号或组合,需要注意的是,如果以基本符号开头的标记,注意基本符号后有一个用于分割标记符和内容的空格。

以下是常用语法

一.标题

嵌套列表 前面带#号,后面带文字,分别表示h1-h6,只到h6,而且h1下面会有一条横线

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

效果如下:

标题.png

二.列表

  1. 无序列表

    形式一

    • a
    • b
    • c
      形式二
    • d
    • e
    • f
      形式三
    • g
    • h
    • i

    效果如下:

无序列表.png

  1. 有序列表

    正常形式

    1. abc
    2. bcd
    3. cde
      错序效果
    4. fgh
    5. ghi
    6. hij

    效果如下:
    无序列表.png

如图,注意,数字后面的点只能是英文的点,有序列表的序号是根据第一行列表的数字顺序来的,错序列表的序号本来是序号是乱的, 但是还是显示 2 3 5

三.嵌套列表

嵌套列表

实例:

  • abcd

    • abcde
    • abcde
    • abcde

      • 第三层

        • 第四层

          • 第五层
  • bcde
  • cdef

    无序列表嵌套

    • 123
    • abc
    • bcd
    • cde
    • 465
    • 789

    有序列表嵌套

    1. abcd
    2. abcde
    3. abcde
    4. abcde
    5. 第三层
    6. bcde
    7. cdef

列表可以嵌套,使用时在嵌套列表前按 tab 或 空格 来缩进,去控制列表的层数

效果如下:

有序列表.png

四.引用说明区块

对某个部分做的内容做一些说明或者引用某某的话等,可以用这个语法。

  1. 正常形式
> 引用内容、说明内容。在语句前面加一个 > ,注意是英文的那个右尖括号,注意空格,引用因为是一个区块,理论上是应该什么内容都可以放,比如说:标题,列表,引用等等。

效果如下:

区块.png

  1. 嵌套区块

这里我只介绍一下我常用的方法,也是个人认为比较规范的一种方法,就是给区块的下一级区块多加一个右尖括号

> 一级引用
>> 二级引用
>>> 三级引用
>>>> 四级引用
>>>>> 五级引用
>>>>>> 六级引用

效果如下:

嵌套区块.png

五.代码块

在发布一些技术文章会涉及展示代码的问题,这时候代码块就显得尤为重要。

1.少量代码,单行使用,直接用`包裹起来就行了

` shaoliangdaima,danhangshiyong `

效果如下:

单行代码.png

  1. 少量代码,单行使用,直接用`包裹起来就行了

daliangdaima,xuyaoduohangshiyong
daliangdaima,xuyaoduohangshiyong
daliangdaima,xuyaoduohangshiyong
daliangdaima,xuyaoduohangshiyong
daliangdaima,xuyaoduohangshiyong

效果如下:

代码块.png

六.链接

  1. 行内式

链接的文字放在[]中,链接地址放在随后的()中,链接也可以带title属性,链接地址后面空一格,然后用引号引起来

简书,
是一个创作社区,任何人均可以在其上进行创作。用户在简书上面可以方便的创作自己的作品,互相
交流。

  1. 参数式

链接的文字放在[]中,链接地址放在随后的:后,链接地址后面空一格,然后用引号引起来

[简书]: https://www.jianshu.com "创作你的创作"
[简书]是一个创作社区,任何人均可以在其上进行创作。用户在简书上面可以方便的创作自己的作品,互相交流。
//参数定义的其他写法
[简书]: https://www.jianshu.com '创作你的创作'
[简书]: https://www.jianshu.com (创作你的创作)
[简书]: <https://www.jianshu.com> "创作你的创作"

以上两种方式其效果图都是一样的,如下:
链接.png

七.图片

  1. 行内式

和链接的形式差不多,图片的名字放在[]中,图片地址放在随后的()中,title属性(图片地址后面空一格,然后用引号引起来),注意的是[]前要加上!

 ![图片链接.png](https://snowlove.synology.me:5106/usr/uploads/2021/05/3541244480.png)
  1. 参数式

图片的文字放在[]中,图片地址放在随后的:后,title属性(图片地址后面空一格,然后用引号引起来),注意引用图片的时候在[]前要加上!

[my-logo.png]: https://upload-images.jianshu.io/upload_images/13623636-6d878e3d3ef63825.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 "my-logo"
![my-logo.png]
//参数定义的其他写法
[my-logo.png]: https://upload-images.jianshu.io/upload_images/13623636-6d878e3d3ef63825.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 'my-logo'
[my-logo.png]: https://upload-images.jianshu.io/upload_images/13623636-6d878e3d3ef63825.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240 (my-logo)
[my-logo.png]: <https://upload-images.jianshu.io/upload_images/13623636-6d878e3d3ef63825.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240> "my-logo"

以上两种方式其效果图都是一样的,如下:

![my-logo.png]

八.分割线

分割线可以由* - _(星号,减号,底线)这3个符号的至少3个符号表示,注意至少要3个,且不需要连续,有空格也可以

            ---
            - - -
            ------
            ***
            * * *
            ******
            ___
            _ _ _
            ______

以上代码的效果图均为:
分割线.png

九.其他

  1. 强调字体

一个星号或者是一个下划线包起来,会转换为倾斜,如果是2个,会转换为加粗

        *md*    
        **md**
        _md_   
        __md__

效果图:

强调字体.png

  1. 转义

基本上和js转义一样,\加需要转义的字符

    \\
    \*
    \+
    \-
    \`
    \_
  1. 删除线
    用~~把需要显示删除线的字符包裹起来
        ~~删除~~

效果图:

删除线.png

十.表格

下面三个例子的效果一样,由此可得:1. 表格的格式不一定要对的非常起,但是为了良好的变成风格,尽量对齐是最好的 2. 分割线后面的冒号表示对齐方式,写在左边表示左对齐,右边为右对齐,两边都写表示居中

实例:

表头1表头2表头3表头4表头5
行一测试内容1行一测试内容2行一测试内容3行一测试内容4行一测试内容5
行二测试内容1行二测试内容2行二测试内容3行二测试内容4行二测试内容5
行三测试内容1行三测试内容2行三测试内容3行三测试内容4行三测试内容5
        例子一
        |123|234|345|
        |:-|:-:|-:|
        |abc|bcd|cde|
        |abc|bcd|cde|
        |abc|bcd|cde|
        例子二
        |123|234|345|
        |:---|:---:|---:|
        |abc|bcd|cde|
        |abc|bcd|cde|
        |abc|bcd|cde|
        例子三
        123|234|345
        :-|:-:|-:
        abc|bcd|cde
        abc|bcd|cde
        abc|bcd|cde

效果图如下:

表格.png

未完待续 继续补充中...
© 版权声明
THE END
喜欢就支持一下吧
点赞 0 分享 收藏

评论 (0)

取消