我也是在视频中看到别人的操作,不知道这是个什么玩意? 直到无意间看到了markdown,才意识到其他人用的是markdown。

当你看到一个人使用类似

  ![blockchain](https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/ u=702257389,1274025419&fm=27&gp=0.jpg "区块链")

  的语法插入了一张图片,使用类似   

​```ruby require 'redcarpet' markdown = Redcarpet.new("Hello World!") puts markdown.to_html```

   的语法生成了一段高亮语法显示的代码块,他可能使用的就是Markdown。

我不打算去学markdwon语法与Typora,只是找了2篇还算不错的文章,先扫扫盲,真的有用到的时候再去学习一下。

  Markdown基本语法  原文:https://www.jianshu.com/p/335db5716248

提到Markdown,很多人首先想到的是简单、Easy等等。的确,Markdown为简单而生。Markdown是由一个叫 JOHN GRUBER 的哥们发明的,它的语法用一篇文章就可以说完。不相信吗?让我们来试试看...

基础语法

标题

Markdown支持6种级别的标题,对应html标签 h1 ~ h6

# h1
## h2
### h3
#### h4
##### h5 ###### h6

以上标记效果如下:

h1

h2

h3

h4

h5
h6

除此之外,Markdown还支持另外一种形式的标题展示形式,其类似于 Setext 标记语言的表现形式,使用下划线进行文本大小的控制

这是一级标题
===
这是二级标题
---

使用这种方式处理标题仅有两种表现形式,即一级标题和二级标题。遗憾的是,简书并不支持这种语法。因此,我们用一张图来展示效果:

这种处理方式在Github的一些开源工程上面比较常见,显而易见的缺点是:文字大小控制级别有限。

段落及区块引用

需要记住的是,Markdown其实就是一种易于编写的普通文本,只不过加入了部分渲染文本的标签而已。其最终依然会转换为html标签,因此使用Markdown分段非常简单,前后至少保留一个空行即可。

而另外一个比较常见的需求就是,我们可能希望对某段文字进行强调处理。Markdown提供了一个特殊符号>用于段首进行强调,被强调的文字部分将会高亮显示

> 这段文字将被高亮显示...

以上标记显示效果如下:

这段文字将被高亮显示...

插入链接或图片

Markdown针对链接和图片的处理也比较简单,可以使用下面的语法进行标记

[点击跳转至百度](http://www.baidu.com)
![图片](https://upload-images.jianshu.io/upload_images/703764-605e3cc2ecb664f6.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

以上标记显示效果如下:

点击跳转至百度

图片

注: 引用图片和链接的唯一区别就是在最前方添加一个感叹号。

列表

Markdown支持有序列表和无序列表两种形式:

  • 无序列表使用*或+或-标识
  • 有序列表使用数字加.标识,例如:1.
* 黄瓜
* 玉米
* 茄子+ 黄瓜
+ 玉米
+ 茄子- 黄瓜
- 玉米
- 茄子1. 黄瓜
2. 玉米
3. 茄子

以上标记显示效果如下:

  • 黄瓜
  • 玉米
  • 茄子
  • 黄瓜
  • 玉米
  • 茄子
  • 黄瓜
  • 玉米
  • 茄子
  1. 黄瓜
  2. 玉米
  3. 茄子

注:这里比较有趣的地方是,对于有序列表,Markdown将只关注你的第一个项目的数字编号。例如:如果第一个项目编号是3,以此类推,第二个项目应该是4,最终将显示为3、4、5。而如果你指定了第一个编号,后面的编号指定错误也没有关系,Markdown将只在乎你的第一个项目编号。

使用列表的一些注意事项

如果在单一列表项中包含了多个段落,为了保证渲染正常,*与段落首字母之间必须保留四个空格

*    段落一小段一
*    段落二小段二

以上标记显示效果如下:

  • 段落一

    小段一

  • 段落二

    小段二

另外,如果在列表中加入了区块引用,区域引用标记符也需要缩进4个空格

* 段落一> 区块标记一
* 段落二> 区块标记二
  • 段落一

    区块标记一

  • 段落二

    区块标记二

注:记住一个原则,如果在和列表配合使用的时候出现了问题,就缩进一次,四个空格或者一个制表符代表一次缩进。如果一次缩进没有解决问题,那就两次。

分隔线

有时候,为了排版漂亮,可能会加入分隔线。Markdown加入分隔线非常简单,使用下面任意一种形式都可以

***
---


产生分隔线的语法要求比较松,符号之间添加空格也可以。

强调

有时候,我们希望对某一部分文字进行强调,使用*或_包裹即可。使用单一符号标记的效果是斜体,使用两个符号标记的效果是加粗

*这里是斜体*
_这里是斜体_**这里是加粗**
__这里是加粗__

这里是斜体
这里是斜体

这里是加粗
这里是加粗

高级用法

插入代码块

Markdown在IT圈子里面比较流行的一个重要原因是,它能够轻松漂亮地插入代码。

方法是,使用反引号`进行包裹即可。如果是行内代码引用,使用单个反引号进行包裹

这是一段var x = 3行内代码

如果插入一整段代码,需要至少使用两个以上反引号进行包裹, 看效果:

fun (x: Int, y: Int): Int {return x + y
}

注:很多人不知道怎么输入反引号。在英文模式下,找到键盘最左侧esc键下面的第一个键点击即可。

插入表格

表格是Markdown语法中比较复杂的一个,其语法如下:

表头|条目一|条目二
:---:|:---:|:---: 项目|项目一|项目二

以上标记显示效果如下:

表头 条目一 条目二
项目 项目一 项目二

注:三个短斜杠左右的冒号用于控制对齐方式,只放置左边冒号表示文字居左,只放置右边冒号表示文字居右,如果两边都放置冒号表示文字居中。

其它

特殊符号处理

Markdown使用反斜杠\插入语法中用到的特殊符号。在Markdown中,主要有以下几种特殊符号需要处理:

\   反斜线
`   反引号
*   星号
_   底线
{}  花括号
[]  方括号
()  括弧
#   井字号
+   加号
-   减号
.   英文句点
!   惊叹号

例如,如果你需要插入反斜杠,就连续输入两个反斜杠即可:\\ => \ 。

注:在内容中输入以上特殊符号的时候一定要注意转义,否则将导致内容显示不全,甚至排版混乱。

如何给文字上色

使用Markdown的同学最郁闷的地方恐怕就是不能给文字添加颜色了。事实上,Markdown的最初目标就是为纯写作而生的。因此,它并没有考虑文字颜色这一点。所以,单纯使用Markdown设置文字颜色已经做不到了。但你可以这样做:

  1. 先用Markdown编辑完成
  2. 导出为html,在需要上色的部分手动添加标签<font color='#ff0000'></font>保存即可。

Markdown软件推荐

如果你是一个Mac用户,我推荐你使用开源的 MacDown:

Macdown

如果你愿意花钱的话,一些收费产品其实更好。例如:Byword,Ulysses,Typora等等都很不错。

日常使用,我就用Macdown。写书,我就用Ulysses。

简单总结

Markdown是一门比html更简单的标记语言,其主要用于日常写作。最终通过相应的编辑器或者脚本转换成html用于页面渲染。如果你是一个作家,或者是一个程序员,Markdown对你来说是一门必备的技能。掌握Markdown真的很简单,如你所见,这篇文章使用了这么短的篇幅就已经将Markdown的语法全部介绍完了。

不过,由于Markdown基础语法的限制,出现了一些针对Markdown语法的加强版本。它支持的语法特性更多,但这不是我们这篇文章的讨论范围。如果你希望快速掌握Markdown,很简单,动起来吧!

 

Typora

平台:多平台(macOS、Windows、linux)

这是一款极致简洁的 markdown 编辑器。简洁到什么程度呢?它甚至连编辑工具栏都没有!

Typora Markdown 语法   原文链接: https://www.jianshu.com/p/aad81020f0e6

第一章 块元素(Block Elements)

1.1 段落和行结束(Paragraph and line breaks)

大多数 markdown 解析器忽略单行分隔符,为了上其他 markdown 解析器识别行分隔符,可以在末尾使用两个空格,或者插入 </br>

1.2 标题(Headers)

标题有6个等级,用 # 号表示

# 标题1
## 标题2
### 标题3
#### 标题4
##### 标题5 ###### 标题6

1.3 引用(Blockquotes)

使用 > 字符,表示引用

> This is a blockquote with two paragraphs. This is first paragraph.
>
> This is second pragraph.Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.> This is another blockquote with one paragraph. There is three empty line to seperate two blockquote.

This is a blockquote with two paragraphs. This is first paragraph.

This is second pragraph.Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
This is another blockquote with one paragraph. There is three empty line to seperate two blockquote.

1.4 列表(Lists)

输入 * 将会创建一个无序列表,也可以使用 + 或者 -

* Red
* Green
* Blue
  • Red
  • Green
  • Blue

输入 1. 将会创建有序列表

1.  Red
2.  Green
3.  Blue
  1. Red
  2. Green
  3. Blue

1.5 任务列表(Task List)

用 [ ] 或者 [X] 未完成,完成)表示列表,通过点击复选框来更改状态(完成/未完成)

- [ ] a task list item
- [ ] list syntax required
- [ ] normal **formatting**, @mentions, #1234 refs
- [ ] incomplete - [x] completed

1.5任务列表.png

1.6 代码块(Code Blocks)

使用 ``` <语言> 按回车键,将会对代码进行高亮

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
​```
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html

1.7 数学(Math Blocks)

可以使用MathJax呈现LaTeX数学表达式。

$$
\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} & \mathbf{j} & \mathbf{k} \\
\frac{\partial X}{\partial u} &  \frac{\partial Y}{\partial u} & 0 \\
\frac{\partial X}{\partial v} &  \frac{\partial Y}{\partial v} & 0 \\
\end{vmatrix}
$$

\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \\ \end{vmatrix}

1.8 表格(Tables)

使用 | First Header | Second Header | 按回车键,将会创建2列的表格

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

还可以使用 : 号,来设置文字对齐方式

| Left-Aligned  | Center Aligned  | Right Aligned |
| :------------ |:---------------:| -----:|
| col 3 is      | some wordy text | $1600 |
| col 2 is      | centered        |   $12 |
| zebra stripes | are neat        |    $1 |
Left-Aligned Center Aligned Right Aligned
col 3 is some wordy text $1600
col 2 is centered $12
zebra stripes are neat $1

1.9 脚注(Footnotes)

使用 [^footnote] 创建脚注.
[^footnote]: Here is the *text* of the **footnote**. 然后,可以把鼠标停留在脚注中,查看内容

You can create footnotes like this[1].

生产环境,可以像这样使用
You can create footnotes like this[^1].
[^1]: Here is the *text* of the **footnote**.

You can create footnotes like this[2].

1.10 横线(Horizontal Rules)

输入 *** 或者 --- 后,按回车键

---

1.11 目录(Table of Contents -- TOC)

输入 [toc] ,按回车键

1.11目录.png


第二章 Span 元素(Span Elements)

2.1 链接(Links)

文字描述包含在 [] 内,链接地址包含在 () 内,() 要紧接着 [] 后面

This is [an example](http://example.com/ "Title") inline link.
[This link](http://example.net/) has no title attribute.

This is an example inline link.

This link has no title attribute.

2.1.1 引用链接(Reference Links)

引用链接样式,使用两个 []

This is [an example][id] reference-style link.Then, anywhere in the document, you define your link label like this, on a line by itself:[id]: http://example.com/  "Optional Title Here"

This is an example reference-style link.
Then, anywhere in the document, you define your link label like this, on a line by itself:

Type 简化了使用方法,如下

[Bing][]
And then define the link:[Bing]: http://bing.com/

Bing
And then define the link:

2.2 图片(Images)

在链接格式前面添加 ! ,如下

![timg.jpg](https://upload-images.jianshu.io/upload_images/6226097-1613f3353bb9ec89.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

timg.jpg

2.3 强调(Emphasis)

对应 HTML 的 <em> 标签

*single asterisks*_single underscores_

single asterisks
single underscores

如果像使用 * 号,在 * 号前使用 \

\*this text is surrounded by literal asterisks\*

*this text is surrounded by literal asterisks*

2.4 加粗(Strong)

**double asterisks**__double underscores__

double asterisks
double underscores

2.5 代码(Code)

在文章中现实代码,用 ` 号表示

Use the `printf()` function.

Use the printf() function.

2.6 删除线(Strikethrough)

~~Mistaken text.~~

Mistaken text.

2.7 下划线(Underlines)

下划线由 HTML 提供

<u>Underline</u>

2.7下划线.png

2.8 Emoji 表情(Emoji)

用两个 : 号包含单词,或者在 编辑 -> 表情与符号 中选择

:happy:

2.8Emoji.png

2.9 内联数学(Inline Math)

这个功能默认是关闭的,如果要打开这个功能(以 Mac 版本为例),选择 Typora -> 偏好设置 -> markdown 标签,勾选内联公式复选框

$\lim_{x \to \infty} \exp(-x) = 0$

下面是简书风格,typora 与之类似
\lim_{x \to \infty} \exp(-x) = 0

2.10 下表(subscript)

这个功能默认是关闭的,如果要打开这个功能(以 Mac 版本为例),选择 Typora -> 偏好设置 -> markdown 标签,勾选下标复选框

H~2~O

H2O

2.11 上标(Superscript)

这个功能默认是关闭的,如果要打开这个功能(以 Mac 版本为例),选择 Typora -> 偏好设置 -> markdown 标签,勾选上标复选框

X^2^

X2

2.12 高亮(Highlight)

这个功能默认是关闭的,如果要打开这个功能(以 Mac 版本为例),选择 Typora -> 偏好设置 -> markdown 标签,勾选高亮复选框

==highlight==

2.12高亮.png


第三章 HTML

可以使用 HTML 样式来写 Markdown,比如

<span style="color:red">this text is red</span>

3.1嵌入内容.png

3.1 嵌入内容(Embed Contents)

<iframe height='265' scrolling='no' title='Fancy Animated SVG Menu'
src='http://codepen.io/jeangontijo/embed/OxVywj/?height=265&theme-id=0&default-tab=css,result&embed-version=2' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'></iframe>

3.1.png

3.2 视频(Video)

<video src="xxx.mp4" />

附录 A 官方文档

Typora 官方文档

附录 B Markdown 文档

简书 Markdown 语法


  1. Here is the text of the footnote. ↩

  2. 这里是脚注 1 的内容。. ↩

  

转载于:https://www.cnblogs.com/lnlvinso/p/10548074.html

markdwon语法与Typora相关推荐

  1. Day01|Markdown语法学习(Typora软件)

    Day01|Markdown语法学习(Typora软件) 一.标题 #号+空格. 二级:## + 空格:三级:### + 空格:四级:#### + 空格. 三级标题 四级标题 二.字体 加粗.倾斜.加 ...

  2. `MD`语法技巧Typora

    MD语法技巧 生成菜单栏 输入 [toc] + 回车键 产生标题,自动更新 标题 标题 1~6 开头#的个数表示,空格+文字.标题有1~6个级别,#表示开始,按换行键结束# H1## H2###### ...

  3. Markdown语法总结+Typora快捷键

    文章目录 前言 Typora常用快捷键 Markdown语法 标题 这是一个六级标题 这是一个五级标题 加粗 代码块 数学式 表情 引用 分割线 表格 链接 URLs 序列 图片 前言 Typora是 ...

  4. Markdwon语法讲解

    Markdwon学习 关于标题 井号 + 空格 + 标题内容 + 回车确定 几个 # 代表几级标题,至多有六级标题 关于字体 Hello,world! 粗体:内容两边各加两个星号** Hello,wo ...

  5. 文档编辑之markdown语法(typora)

    1 插入代码块(以Java为例) 输入法英文状态下输入 ```Java class CountDownActivity : AppCompatActivity() {val countDownMode ...

  6. 有一个强大又好看的,赛过Typora,阿里开发的语雀编辑器

    前段时间,逛逛GitHub 盘点了几个开源的笔记应用,有读者在后台留言,语雀的编辑器即将开源,可以关注一下. 之前一直用 Typora 做笔记,没有试用过语雀,只知道是支付宝旗下的,趁着这个机会我去体 ...

  7. Typora一款让你无法拒绝的MarkDown编辑器

    Typora一款让你无法拒绝的MarkDown编辑器 最近因为查看MarkDown格式笔记的缘故无意中接触到了Typora这款编辑器,安装打开这界面简直不要太想,至今为至还没用过这么好的编辑器(在Ma ...

  8. Typora下载安装及使用方法

    文章目录 前言 一.简介 二.下载安装 1.下载 2.安装 三.使用方法 四.用法 五.结尾 前言 俗话说,最好的学习方法就是把学过的东西讲给别人听,所以我选择了把接触到的一些有用的.有趣的内容,通过 ...

  9. Markdown语法(常用语法,快速掌握)

    这里以Typora为例,总结一些常用到的Markdown语法,不是最完整的,但足以应对平时大部分的需求,非常易于理解,可以快速掌握.文中的语法在typora中也有对应的快捷方式,比如插入一个表格,快捷 ...

最新文章

  1. 获得html元素自身的宽度
  2. 域名系统DNS、文件传送协议FTP、动态主机配置协议DHCP、远程登录协议TELNET、电子邮件协议(SMTP/POP3/IMAP)、常用端口
  3. DBCC SHRINKFILE收缩日志/收缩数据库/收缩文件
  4. 【Microsoft Azure学习之旅】测试消息队列(Service Bus Queue)是否会丢消息
  5. mysql 1066解决方法_MySQL查询语法帮助:错误#1066-表格/别名不唯...
  6. session的简介
  7. Centos yum 安装JDK及配置环境变量
  8. Intel 中断和异常处理 - 目录
  9. java中的string类型_Java中的字符串类型(String)
  10. oracle 12c 取消omf,Oracle12c创建及删除PDB
  11. LeetCode Can I Win
  12. 白话/图示 sleep_on/wake_up的执行流程
  13. 常用Linux命令--CPU和GPU查看
  14. matlab调和均值滤波_matlab-均值滤波
  15. 课程作业练习 K均值聚类 python实现(最小误差平方和准则)
  16. java framemaker教程_Freemarker入门案例
  17. 【代码质量】-阿里巴巴java开发手册(代码质量提升神器)学习笔记
  18. 一个不错的shell 脚本教程 (国)
  19. 2021顶墙十大公认品牌排名榜揭晓
  20. nrm是什么?以及nrm的安装与命令

热门文章

  1. 在哪里能下载纯净的系统镜像?让我来告诉你……
  2. boss直聘登录不显示服务器忙,boss直聘是怎么回事 boss直聘登录不上怎么办
  3. Echarts实现3d图表
  4. CmakeList.txt 中添加某个子目录下的所有源文件方法
  5. python快速将excel文件转化为txt文件
  6. LG 5G手机V50 ThinQ成新亮点 引入掌静脉辨识G8 ThinQ
  7. golang开发工具自定义delve
  8. 把KMP匹配算法讲清楚
  9. Java中文字符串截取,不能返回半个汉字
  10. java基于Springboot+vue的超市购物商城网站 elementui