深入了解Markdown究竟是什么?附markdown标准语法摘要,以及CSDN-markdown编辑器文档

碎碎念~ 写在最最最前面的话

这是我CSDN第一篇博文,事实上应该也是我人生的第一篇自创文章。这篇关于Markdown的介绍文档是一时间心血来潮,既是自己想要了解,顺便做做笔记,也是通过这篇笔记来练习使用markdown。不足之处,还望海涵~

(本篇笔记糅合了很多网络资料,侵删)

先来了解什么是markdown

 Markdown其实就是一种写作语言的语法规范,是目前互联网上流行的文本编辑语法,它胜在语法简洁、操作简便,以及软件支持性强。

" markdown 是一种轻量级标记语言,创始人是约翰·格鲁伯(John Gruber)。它允许人们 “使用易读易写的纯文本格式编写文档,然后转换成有效的 HTML 文档。”

由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,目前许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。 如GitHub、Reddit、Diaspora、Stack Exchange、OpenStreetMap 、SourceForge、CSDN、简书等,甚至还能被使用来撰写电子书。

 举个栗子,拿word/markdown/HTML做个对比,你也许能很快清晰markdown究竟是什么。

wordmarkdown
软件语法
支持文本编辑与格式排版支持文本编辑与格式排版
功能复杂,选择繁多语法简洁,功能精简
依赖编辑工具书写不依赖编辑工具书写
编辑内容=文本+格式编辑内容=纯文本
内容可移植,但兼容性差内容可移植,且兼容性强
格式呈现不需要工具渲染需要特别的工具渲染
内容打开方式:支持.doc的任何软件/插件内容打开方式:支持.md的任何软件/插件
支持.doc或.txt文件的就不用多说了吧,一般浏览器以及所有操作系统都有支持这些文件打开和编辑的软件;
支持markdown的,如简书、知乎、CSDN、Github、Gitlab、Gitbook 全部都支持 markdown 写作

markdown编辑器推荐markdown编辑器推荐

 你不了解Markdown,但一定使用过word,现在大多数人在写文档的时候会选择使用word进行编辑和排版,word功能强大,同时也有很多支持高级用户的复杂功能,这些功能摆在我们眼前的时候我们就会因为选择和学习而浪费大量的时间。

比如选择个字体呀,调整个行间距呀,分级排版啊等等(我就曾被长文档编辑的多级标题设置搞得头晕眼花~)

 相比之下markdown的语法规范且易上手,学习成本就比较低。不过markdown语法有标准语法和拓展语法,标准语法适用于所有 markdown 工具,扩展语法可能每个工具都不一样。

markdownHTML
轻量级标记语言超文本标记语言
标记符数量少标记符数量多
多用于写文章用于Web开发(网页制作)
不依赖编辑工具书写不依赖编辑工具书写
需要特别的工具渲染需要特别的工具渲染

同HTML一样,你可以使用任何一款纯文本编辑工具来编辑和读取包含markdown格式的文本,但只有在一些特别的工具(如有道云笔记)或网站(如简书)下,才能呈现出渲染后的格式。
同时markdown也可以使用HTML来添加格式和排版,这意味着,你即可以使用标准的markdown语法,也可以在其中嵌入HTML标记,但也只能对应其中的一小部分。

markdown标准语法

文本样式

*强调文本 * _强调文本 _

**加粗文本 ** __加粗文本 __

==标记文本 ==

~~删除文本 ~~

1

引用文本

2

H2O 是液体。
210 运算结果是 1024.

创建表格

在这里插入图片描述

项目Value
电脑$1600
手机$12
导管$1

插入链接与图片

3

链接: link.
图片: Alt

带尺寸的图片:
在这里插入图片描述
Alt

居中的图片:
4
Alt

居中并且带尺寸的图片:
5
Alt

插入代码片

博客设置页面可以选择代码片高亮样式,下面展示同样高亮的 代码片.
在这里插入图片描述

// An highlighted block
var foo = 'bar';

生成列表

在这里插入图片描述

  • 项目
    • 项目
      • 项目
  1. 项目1
  2. 项目2
  3. 项目3
  • 计划任务
  • 完成任务

设定内容居中、居左、居右

在这里插入图片描述

使用:---------:居中
使用:----------居左
使用----------:居右

第一列第二列第三列
第一列文本居中第二列文本居右第三列文本居左

SmartyPants

在这里插入图片描述

SmartyPants将ASCII标点字符转换为“智能”印刷标点HTML实体。例如:

TYPEASCIIHTML
Single backticks'Isn't this fun?'‘Isn’t this fun?’
Quotes"Isn't this fun?"“Isn’t this fun?”
Dashes-- is en-dash, --- is em-dash– is en-dash, — is em-dash

创建自定义列表

在这里插入图片描述

Markdown
Text-to- HTML conversion tool
Authors
John
Luke

创建注脚

一个具有注脚的文本。1

注释

Markdown将文本转换为 HTML
在这里插入图片描述

KaTeX数学公式

(好难~不看了吧,上工具不香嘛)
在这里插入图片描述

您可以使用渲染LaTeX数学表达式 KaTeX:

Gamma公式展示 Γ ( n ) = ( n − 1 ) ! ∀ n ∈ N \Gamma(n) = (n-1)!\quad\forall n\in\mathbb N Γ(n)=(n1)!nN 是通过欧拉积分

Γ ( z ) = ∫ 0 ∞ t z − 1 e − t d t   . \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. Γ(z)=0tz1etdt.

你可以找到更多关于的信息 LaTeX 数学表达式here.

CSDN拓展语法(功能)

CSDN为了让用户更加便捷,增加了图片拖拽功能。

甘特图功能

6

Mon 06 Mon 13 Mon 20 已完成 进行中 计划一 计划二 现有任务 Adding GANTT diagram functionality to mermaid
  • 关于 甘特图 语法,参考 这儿,

UML 图表

可以使用UML图表进行渲染。 Mermaid. 例如下面产生的一个序列图:
7

张三 李四 王五 你好!李四, 最近怎么样? 你最近怎么样,王五? 我很好,谢谢! 我很好,谢谢! 李四想了很长时间, 文字太长了 不适合放在一行. 打量着王五... 很好... 王五, 你怎么样? 张三 李四 王五

这将产生一个流程图。:

链接
长方形
圆角长方形
菱形
  • 关于 Mermaid 语法,参考 这儿,

FLowchart流程图

依旧支持flowchart的流程图:

Created with Raphaël 2.2.0 开始 我的操作 确认? 结束 yes no
  • 关于 Flowchart流程图 语法,参考 这儿.

导出与导入

导出

如果你想尝试使用此编辑器, 你可以在此篇文章任意编辑。当你完成了一篇文章的写作, 在上方工具栏找到 文章导出 ,生成一个.md文件或者.html文件进行本地保存。

导入

如果你想加载一篇你写过的.md文件,在上方工具栏可以选择导入功能进行对应扩展名的文件导入,
继续你的创作。


  1. 注脚的解释 ↩︎

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值