其实前端人员在做项目评估或者是git上书写东西的时候。是不是有的时候有点烦恼呢,

其实git中的 gitbook就是采用 markdown的语法
包括项目中一般的ReadME的那个文档,以md结尾的文件 都是采用的mardkdown 语法, 可能很多小伙伴都知道这个东西,但从来没有好好去了解过呢,

这不是前几天 做项目评估 一般都要 进行几个模块的细节划分呢,层级明显,如果只是通过一般的txt 其实也可以 但是 是不是 太low了,
如果我们使用腾讯文档来做的话,还得去学习一个操作方式 很难受,对于offce 不知道别的人 如何。反正我是有点不太喜欢使用那个去做项目评估的结果,

要不就是 excel 这个。纯表格的形式 也不是我的想要的。
这个时候 markdown 可能就是一个很好的选择了。

好了 上面有的扯远了 ,其实csdn采用的编辑也是markdwon模式嘿嘿

我们正式进入主题了哦

markdown的讲解

markdown的插件的安装。

对于前端人员来说,我们用的最多可能就是 Vs Code 了。 我们可以去VS code中下载一个插件。进行预览md文件和。转换 pdf和图片使用
在这里插入图片描述
在文件中创建一个md 文件中。然后点击鼠标右键就可以进入 预览模式
左边书写 右边就可以直接进入预览模式,还可以将我们写的markdown文件转换成。图片、pdf、html等文件
在这里插入图片描述


1. 标题 用法

标题在markdwon中就是。# 代表 标题
注意所有的markdown语法后面得加个空格呢比如: # 我是标题1
后面说的也得加呢

# 我是标题1
## 我是标题2
### 我是标题3
#### 我是标题4
##### 我是标题5
###### 我是标题6
也可以用
我是标题1
=
我是标题2
--   

看下效果哈。

我是标题1

我是标题2

我是标题3

我是标题4
我是标题5
我是标题6

也可以用

我是标题1

我是标题2


2 文本的用法

  1. 在markdown 中换行的话 需要 用 两个空格 + 换行符号
  2. 斜体。要用。** 或者 __ 两个 星号 或者下划线 包括
  3. 粗体。 则是。**** 或者 ____ 。 两侧各两个星号 或者 两个下划线包括
  4. 粗斜体。 则是。******。这样两侧各三个星号 或者三个下划线。包括着
  5. 删除线 则是。 ~~~~. 两侧各两个波浪线
  6. 下划线。 直接。 1111. html中的 u标签就可以了
  7. 分割线 则是。 — 三个减号就可以了

*斜体*
__加粗__
***粗斜体***
~~删除线~~
<u>下划线</u>  

---

看下效果哈。
斜体
加粗
粗斜体
删除线
下划线


3 . 列表

3. 1 无序列表

则是一个 前面加个。*。星号就可以

* 我是列表1
* 我是列表2
* 我是列表3
* 我是列表3

看下效果哈。

  • 我是列表1
  • 我是列表2
  • 我是列表3
  • 我是列表3。

有序列表

有序列表 则是前面直接写数字就可以。

1. 我是列表1
2. 我是列表2
3. 我是列表3
4. 我是列表3
  1. 我是列表1
  2. 我是列表2
  3. 我是列表3
  4. 我是列表3

4. 引用

引用则是 一个 > 和标题有点像

> 我是引用1
>> 我是引用2
>>> 我是引用3
>>>> 我是引用4

看下效果哈

我是引用1

我是引用2

我是引用3

我是引用4

5. 代码块

如果我们想在markdown中写代码的话 其实也是可以
语法是。左右两侧。三个```javascript```

在这里插入图片描述
我们看下效果哈。是不是 js 语法就高亮了

    console.log('hello world')

6 超链接

这个更简单 就是
注意其实都是在英文下的括号哈
[]()。前面的括号写 文本描述。后面写地址
或者。<>

[]()
[冲哥的博客](https://yunchong.blog.csdn.net/)
<https://yunchong.blog.csdn.net/>

看下效果呢
冲哥的博客
https://yunchong.blog.csdn.net
嘿嘿 你们可以点击看下呢

7. 图片

图片的格式和。超链接也差不多呢. 和图片有点区别的就是 前面有个 感叹号
![图片的描述(title)](图片的地址)

![火影忍者](https://img0.baidu.com/it/u=426924998,4015543247&fm=26&fmt=auto&gp=0.jpg)

看下实际效果哈 暴露博主是个火影迷,嘿嘿
火影忍者


其实还有很多的用处。但没必要一一赘述了哈。更加高级的可以去看看 专门的markdown 文档 哈

我这里只是抛砖引玉的效果
关注我 持续更新前端知识。

Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐