欢迎使用 Markdown在线编辑器 MdEditor

Markdown是一种轻量级的「标记语言」

Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的HTML页面,Markdown文件的后缀名便是“.md”

MdEditor是一个在线编辑Markdown文档的编辑器

MdEditor扩展了Markdown的功能(如表格、脚注、内嵌HTML等等),以使让Markdown转换成更多的格式,和更丰富的展示效果,这些功能原初的Markdown尚不具备。

Markdown增强版中比较有名的有Markdown Extra、MultiMarkdown、 Maruku等。这些衍生版本要么基于工具,如Pandoc,Pandao;要么基于网站,如GitHub和Wikipedia,在语法上基本兼容,但在一些语法和渲染效果上有改动。

MdEditor源于Pandao的JavaScript开源项目,开源地址Editor.md,并在MIT开源协议的许可范围内进行了优化,以适应广大用户群体的需求。向优秀的markdown开源编辑器原作者Pandao致敬。

MdEditor的功能列表演示

标题H1

标题H2

标题H3

标题H4

标题H5
标题H5

字符效果和横线等


删除线 删除线(开启识别HTML标签时)

斜体字 斜体字

粗体 粗体

粗斜体 粗斜体

上标:X2,下标:O2

缩写(同HTML的abbr标签)

即更长的单词或短语的缩写形式,前提是开启识别HTML标签时,已默认开启

The HTML specification is maintained by the W3C.

引用 Blockquotes

引用文本 Blockquotes

引用的行内混合 Blockquotes

引用:如果想要插入空白换行即<br />标签,在插入处先键入两个以上的空格然后回车即可,普通链接

锚点与链接 Links

普通链接

普通链接带标题

直接链接:https://www.mdeditor.com

[锚点链接][anchor-id]

[anchor-id]: https://www.mdeditor.com/

mailto:test.test@gmail.com

GFM a-tail link @pandao

邮箱地址自动链接 test.test@gmail.com www@vip.qq.com

@pandao

多语言代码高亮 Codes

行内代码 Inline code

执行命令:npm install marked

缩进风格

即缩进四个空格,也做为实现类似 <pre> 预格式化文本 ( Preformatted Text ) 的功能。

<?php
echo "Hello world!";
?>

预格式化文本:

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

JS代码

function test() {
console.log("Hello world!");
}

HTML 代码 HTML codes

<!DOCTYPE html>
<html>
<head>
<mate charest="utf-8" />
<meta name="keywords" content="Editor.md, Markdown, Editor" />
<title>Hello world!</title>
<style type="text/css">
body{font-size:14px;color:#444;font-family: "Microsoft Yahei", Tahoma, "Hiragino Sans GB", Arial;background:#fff;}
ul{list-style: none;}
img{border:none;vertical-align: middle;}
</style>
</head>
<body>
<h1 class="text-xxl">Hello world!</h1>
<p class="text-green">Plain text</p>
</body>
</html>

图片 Images

图片加链接 (Image + Link):

Follow your heart.


列表 Lists

无序列表(减号)Unordered Lists (-)

  • 列表一
  • 列表二
  • 列表三

无序列表(星号)Unordered Lists (*)

  • 列表一
  • 列表二
  • 列表三

无序列表(加号和嵌套)Unordered Lists (+)

  • 列表一
  • 列表二
    • 列表二-1
    • 列表二-2
    • 列表二-3
  • 列表三
    • 列表一
    • 列表二
    • 列表三

有序列表 Ordered Lists (-)

  1. 第一行
  2. 第二行
  3. 第三行

GFM task list

  • GFM task list 1
  • GFM task list 2
  • GFM task list 3
    • GFM task list 3-1
    • GFM task list 3-2
    • GFM task list 3-3
  • GFM task list 4
    • GFM task list 4-1
    • GFM task list 4-2

绘制表格 Tables

项目 价格 数量
计算机 $1600 5
手机 $12 12
管线 $1 234
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell
Function name Description
help() Display the help window.
destroy() Destroy your computer!
Left-Aligned Center Aligned Right Aligned
col 3 is some wordy text $1600
col 2 is centered $12
zebra stripes are neat $1
Item Value
Computer $1600
Phone $12
Pipe $1

特殊符号 HTML Entities Codes

& ¨ ¡ £

& < > ¥ € ± ¶ § ¦ ¯ « ·

X² Y³ ¾ ¼ × ÷ »

18ºC " '

[========]

Emoji表情

Blockquotes

GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-5x:

  • @mentions, #refs, links, formatting, and tags supported :editormd-logo:;
  • list syntax required (any unordered or ordered list supported) :editormd-logo-3x:;
  • [ ] this is a complete item ;
  • []this is an incomplete item test link :fa-star: @pandao;
  • [ ]this is an incomplete item :fa-star: :fa-gear:;
    • this is an incomplete item test link :fa-star: :fa-gear:;
    • this is :fa-star: :fa-gear: an incomplete item test link;

反斜杠 Escape

*literal asterisks*

[========]

科学公式 TeX(KaTeX)

\[E=mc^2
\]

行内的公式$$E=mc2$$行内的公式,行内的$$E=mc2$$公式。

\[x > y
\]
\[\(\sqrt{3x-1}+(1+x)^2\)
\]
\[\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))
\]

多行公式:

\displaystyle
\left( \sum\_{k=1}^n a\_k b\_k \right)^2
\leq
\left( \sum\_{k=1}^n a\_k^2 \right)
\left( \sum\_{k=1}^n b\_k^2 \right)
\displaystyle
\frac{1}{
\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{
\frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {
1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}}
{1+\cdots} }
}
}
f(x) = \int_{-\infty}^\infty
\hat f(\xi)\,e^{2 \pi i \xi x}
\,d\xi

分页符 Page break

Print Test: Ctrl + P

[========]

绘制流程图 Flowchart

st=>start: 用户登陆
op=>operation: 登陆操作
cond=>condition: 登陆成功 Yes or No?
e=>end: 进入后台 st->op->cond
cond(yes)->e
cond(no)->op

[========]

绘制序列图 Sequence Diagram

Andrew->China: Says Hello
Note right of China: China thinks\nabout it
China-->Andrew: How are you?
Andrew->>China: I am good thanks!

End

Markdown的在线使用的更多相关文章

  1. MarkDown/Html在线转换(支持代码高亮,可复制到微信公众号、今日头条)

    MarkDown/Html在线转换能够将md渲染成html并且能保持代码高亮,可以方便的复制待格式的html粘贴到微信公众号,CSDN,简书,博客园,开源中国等. 扫码体验在线助手小程序 我是java ...

  2. Yii2项目实现Markdown功能 在线Markdown编辑器

    版权声明:本文为博主原创文章,欢迎扩散,扩散请务必注明出处. Yii中添加MarkDown编辑器 主要使用了两个网页Markdown编辑器,都带预览功能. 1,ijackua/yii2-lepture ...

  3. 很好用的在线markdown编辑器

    # 欢迎使用 Cmd Markdown 编辑阅读器 基本符号 *,-,+ 3个符号效果都一样,这3个符号被称为 Markdown符号 空白行表示另起一个段落 `是表示inline代码,tab是用来标记 ...

  4. 【第一篇献给markdown】markdown入门

    Markdown 是一种轻量级的「标记语言」,语法十分简单,常用的标记符号也不超过十个.虽然功能很强大,但是上手估计不用十分钟. 一些认识 Markdown 官方文档 这里可以看到官方的 Markdo ...

  5. Markdown示例

    欢迎使用 Cmd Markdown 编辑阅读器 我们理解您需要更便捷更高效的工具记录思想,整理笔记.知识,并将其中承载的价值传播给他人,Cmd Markdown 是我们给出的答案 -- 我们为记录思想 ...

  6. Markdown:纯文本进行网页排版的简单标记语言

    Markdown http://daringfireball.net/projects/markdown/ 2016-08-03 Markdown是一种标记语言,对纯文本使用简单的标记符号进行网页格式 ...

  7. MarkDown教程

    MarkDown笔记 在线编辑器其他教程 [1.标题] 标题1 标题1=== 标题2 标题2--- 标题3 1 2 3 4 5 6 7 7 #1 ##2 ###3 ####4 #####5 ##### ...

  8. 我要爱死这个markdown 了

    今天上班依旧看wpdang的文章,最后作者说,文章使用markdown写的,好奇心促使我搜了一把什么是markdown.然后看到了这篇文章,一瞬间就开始兴奋了.顿时觉得,这个东西太好用 了,简直又激起 ...

  9. 试用cmd markdown

    欢迎使用 Cmd Markdown 编辑阅读器 我们理解您需要更便捷更高效的工具记录思想,整理笔记.知识,并将其中承载的价值传播给他人,Cmd Markdown 是我们给出的答案 -- 我们为记录思想 ...

  10. 用Markdown优雅的写文章

    简介 Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式. 简单点来说,Markdown是文本标记语言,在普通文本的基础上加了一些特殊标 ...

随机推荐

  1. drf-序列化字段及参数、序列化和反序列化高级用法、ModelSerializer使用

    1.序列化类常用字段和字段参数 1.1 常用字段类 1.BooleanField 2 NullBooleanField 3 CharField CharField(max_length=None, m ...

  2. 基于APIView&ModelSerializer写接口

    目录 基于APIView&ModelSerializer写接口 一.首先准备前提工作 1.模型代码 2.路由代码 3.视图代码 二.继承Serializer序列化定制字段的三种方法 1.通过s ...

  3. spring-cloud03-consul

    官网的安装说明https://learn.hashicorp.com/tutorials/consul/get-started-install 1.下载安装 环境:阿里云服务器,consul1.9.5 ...

  4. .NET 和 .NET Core 使用 JWT 授权验证

    JWT介绍 参考文章 https://www.cnblogs.com/cjsblog/p/9277677.html 一..NET 中使用 1. NuGet包 搜索JWT,下载安装(本人用的是8.2.3 ...

  5. MySQL中的函数使用

    有三张表,学生表(t_student),班级表(t_class),成绩表(t_grade),三张表的字段设计如下                                        查询大竹 ...

  6. Rpc-实现Zookeeper注册中心

    1.前言 本文章是笔主在声哥的手写RPC框架的学习下,对注册中心的一个拓展.因为声哥某些部分没有保留拓展性,所以本文章的项目与声哥的工程有部分区别,核心内容在Curator的注册发现与注销,思想看准即 ...

  7. 学习Java Day21

    今天学习了静态导入,可以导入静态方法和静态字段

  8. ES6的新特性有哪些

    1.let.const 2.模板字符串 3.箭头函数 4.解构赋值 5.promise 6.数组的新方法 7.对象的新方法 8.class类 9.新增Set.Map两种数据结构 10.proxy

  9. 【TS】联合类型--类型断言--类型推断

    联合类型 在实际开发中,我们接收的变量可能不是一个固定的数据类型,而是动态的多个数据类型,此时用单个固定的数据类型去接收很明显是不行的,为了解决这种可能会接收多个不同数据类型的变量就需要用到联合类型. ...

  10. 什么是整体设备效率(OEE)?

    整体设备效率 (OEE) 用于监控制造效率.得到的OEE百分比是通用的,可以跨不同行业和流程进行比较. OEE可用性 OEE可用性=实际运行时间/生产时间 OEE可用性是实际运行时间和计划生产时间之间 ...