惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

The Last Watchdog
The Last Watchdog
C
Cyber Attacks, Cyber Crime and Cyber Security
L
LINUX DO - 热门话题
G
GRAHAM CLULEY
S
Schneier on Security
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
S
SegmentFault 最新的问题
IT之家
IT之家
阮一峰的网络日志
阮一峰的网络日志
Recorded Future
Recorded Future
I
Intezer
云风的 BLOG
云风的 BLOG
博客园 - Franky
月光博客
月光博客
大猫的无限游戏
大猫的无限游戏
T
Tenable Blog
The Hacker News
The Hacker News
T
The Blog of Author Tim Ferriss
Attack and Defense Labs
Attack and Defense Labs
D
DataBreaches.Net
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
N
News and Events Feed by Topic
有赞技术团队
有赞技术团队
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
N
News and Events Feed by Topic
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
S
Secure Thoughts
The Register - Security
The Register - Security
B
Blog
Security Archives - TechRepublic
Security Archives - TechRepublic
The Cloudflare Blog
Webroot Blog
Webroot Blog
W
WeLiveSecurity
H
Heimdal Security Blog
博客园 - 三生石上(FineUI控件)
V
Vulnerabilities – Threatpost
G
Google Developers Blog
O
OpenAI News
V
V2EX
罗磊的独立博客
博客园_首页
N
News | PayPal Newsroom
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
TaoSecurity Blog
TaoSecurity Blog
Cloudbric
Cloudbric
H
Hacker News: Front Page
博客园 - 叶小钗
T
Tor Project blog
AI
AI

jdhao's digital space

Conversion between base64 and OpenCV or PIL Image 腾讯云对象存储博客图床开启 CDN 加速(不需要购买额外域名) Search and Replace in Multiple Files in Vim/Neovim Change Table Column Width in LaTeX Image or Table Side by Side in LaTeX LaTeX 并排显示图像或表格 Firenvim: Neovim inside Your Browser Content inside HTML tags missing in Latest Hugo? Creating Markdown Front Matter with Ultisnips Labelme JSON 标注格式转 voc XML 格式 Nifty Nvim Techniques That Make My Life Easier -- Series 6 macOS 下如何为视频制作字幕 Running Command Asynchronously inside Neovim Resolving Merge Conflict after Git Stash Pop Pylint: command not found? A Hands-on Experience with Neovim's Built-in LSP Support How to Convert PDF to Images with Imagemagick 互联网上常用缩略语集锦 File Backup in Neovim Converting PDF Pages to Images with Poppler Nifty Nvim Techniques That Make My Life Easier -- Series 5 Neovim Configuration for System-wide Use How to sort a list of tuple or list in Python -- lambda or itemgetter? Building A Vim Statusline from Scratch 人类第一颗原子弹爆炸始末 Distributed Training in PyTorch with Horovod Learning Expect Programming Essential Knowledge about SSH Nifty LaTeX Techniques -- Series 1 更改 Adsense 邮寄地址,重新寄送 PIN Mintty Tips and Configurations Generating Table of Contents for Markdown with Tagbar Convert Python Script to Exe on Windows with Pyinstaller Ubuntu on Windows Missing after Windows Update 使用代理加速 Mac 终端下载速度 My Experience with Several Zsh Plugin Managers 深圳租房小记 How to Install zplug inside Docker Container Why don't settings inside bashrc or bash_profile take effect? Setting Up Locale in Linux 谷歌 Adsense 申请及在 Hugo 中的配置 How to Write Algorithm Pseudo Code in LaTeX Nifty Nvim Techniques That Make My Life Easier -- Series 4 A Few Grammar Questions in Writing How to Read and Write Images with Unicode Paths in OpenCV Creating A Professional Table in LaTeX with booktabs How to Create Proper Folding for Vim/Nvim Configuration Linux Tips and Tricks -- s1 JPEG Image Orientation and Exif How Do I Show the Current File Path In Neovim? JPEG Image Quality in PIL Difference between view, reshape, transpose and permute in PyTorch Convert PIL or OpenCV Image to Bytes without Saving to Disk Fast Movement and Navigation Inside Vim or Neovim Unintuitive Behaviour of Case Sensitivity in Python glob Binding Keys in Zsh 几把机械键盘试用体验 Nvim Autocompletion with Deoplete Converting Markdown to Beautiful PDF with Pandoc Exclusive and Inclusive Motion in Neovim/Vim Nifty Nvim Techniques Which Make My Life Easier -- Series 3 Why Doesn't Jedi Autocompletion Work for Some Methods Vim-like Editing inside Browser Markdown 生成 HTML 时汉字之间出现多余空格问题 小米 9 安装谷歌商店(Google Play Store)与相关配置 Create Mappings That Take A Count in Neovim Spell Checking in Nvim English Words Completion inside Neovim/Vim How to Use Python Inside Vim Script with Neovim Nifty Little Nvim Techniques to Make My Life Easier -- Series 2 Setting up Ultisnips for Neovim Mac 上罗技 M590 鼠标设置 Nifty Little Nvim Techniques to Make My Life Easier -- Series 1 A Complete Guide on Writing LaTeX with Vimtex in Neovim Manipulating Images with Alpha Channels in Pillow Sublime Text Regular Expression Cheat Sheet Cropping Rotated Rectangles from Image with OpenCV Boosting Your Productivity on Terminal with Zsh and Plugins 最新版 Rime 输入法使用 (2022 更新) Display Image with Pillow inside Ubuntu on Windows Faster Directory Navigation with z.lua Cmder Advanced Configurations Nvim-qt Settings on Windows 10 Tmux Plugin Install and Management How to Debug Python Code in Terminal Markdown Writing and Previewing in Neovim -- A Complete Guide Line Number Settings for More Efficient Movement in Neovim 两个大规模中文语料库介绍以及处理 Windows 系统下几款程序员不可不用的神器 我的 2018 阅读清单 A Complete Guide to Neovim Configuration for Python Development How Is Newline Handled in Python and Various Editors? Two Issues Related to ImageFont Module in PIL 在 Listary 中调用 GoldenDict 或欧路词典查单词 Reading and Writing Text Files on Windows The Mathematics behind Font Shapes --- Bézier Curves and More 快速识别图片字体:字体识别工具介绍 Deoplete Failed to Load at Startup after Updating Python neovim Package What Is The Difference between pip, pip3 and pip3.6 Shipped with Anaconda3? Windows 10 系统下 Neovim 安装与配置
写给初学者的 Markdown 教程
2018-09-21 · via jdhao's digital space

这是一篇帮助初学者快速入门 Markdown 的文章,看完此篇,你应该就可以使用 Markdown 写出格式规范的文章了。

Markdown 是一种可标记语言,通过简单的标记,可以将纯文本内容转为内容丰富的 HTML 网页,实现字体加粗,链接,插入图片等等纯文本无法实现的功能。

Markdown 类似编程语言,需要先编写,然后通过渲染器把 Markdown 源文件转为内容丰富 的 HTML 网页(类似于编程语言的编译器,把一种语言翻译为另外一种语言)。

Markdown 优点#

采用 Markdown 生成的文档,格式规范,清晰明了,避免了纯文本文件无法对文本格式进 行控制的尴尬,是书写技术文档的最佳选择之一。同时,Markdown 又不像网页那样复杂, 仅仅使用简单的语法,就能生成丰富的内容,这也是 Markdown 流行的原因。

Markdown 具体语法#

本部分介绍常用的 Markdown 语法,由于 Markdown 类似编程语言,因此对书写格式有一 定要求,符合要求才能生成想要的结果,书写时候一定要遵循规范。

标题(heading)#

Markdown 中的标题采用 # 来标志,# 后面跟具体的标题文本。# 的个数代表标题 级别:1 个 # 代表一级标题,2 个 # 代表二级标题,以此类推。

注意点#

  • # 与标题的文本之间,需要留一个空格,否则可能无法正常渲染为标题样式
  • 标题级别不要太多,五六级标题与正文文本字体大小区别已经不大,因此意义也不大

效果展示与源代码#

源代码:

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

生成的标题效果为:

markdown_heading.png

列表#

Markdown 中的列表,分为有序列表以及无序列表两种。

  • 对于有序列表,使用数字开头,后面跟 .(英文的句号),空格,后面写上该步骤内容。
  • 对于无序列表,使用 + 或者 - 开头,空格,后面写具体内容。

你也可以创建多级嵌套列表,在某一级别下另起一行,缩进四个空格开始更低级别。

注意点#

  • 列表项前面需要空一行,否则某些 Markdown 渲染器无法正常识别列表
  • 列表标志后面需空格

效果展示与源代码#

源代码:

1. 有序列表,这是步骤一
    1. 步骤 1.1
        1. 步骤 1.1.1
        2. 步骤 1.1.2
        3. 步骤 1.1.3
    2. 步骤 1.2
    3. 步骤 1.3
2. 有序列表,这是步骤二
    1. 步骤 2.1
    2. 步骤 2.2
3. 有序列表,这是步骤三

+ 车
    + 汽车
        + BMW
        + BYD
    + 火车
        + 普通列车
        + 动车
        + 高铁
    + 自行车
+ 动物
    + 猴子
    + 骆驼
    + 大象
+ 人
    + 白人
    + 黑人
        + 非洲黑人
        + 美洲黑人
        + 亚洲黑人
    + 黄人

生成的列表效果如下图:

markdown_list.png

强调与着重表示#

要使用斜体,可以使用一对 * 或者 _包围要斜体的文字;要加粗文字,使用两对 * 或者 _ 包围文字。

如何既斜体又加粗文字?*_ 交替使用即可,像这样 ,或者 这样

以上文字源代码为:

要使用*斜体*,可以使用一对 `*` 或者 `_`包围要斜体的文字;要**加粗文字**,使用两对 `*` 或者 `_` 包围文字。

如何既斜体又加粗文字?`*` 与 `_` 交替使用即可,*__像这样__* ,或者 _**这样**_ 。

注意点#

  • 使用 _ 进行斜体或者着重表示,可能需要和周围文字之间加上空格,否则无法正常渲 染,建议使用 *

链接#

可以给文字加上链接,链接的格式为 [](),方括号内填写希望显示的文字,圆括号内填 写该文字具体链接的网页地址。

例如,我们不可以访问谷歌YouTube。直接书写网页地址也可以,用 <> 包含网页, 像这样,https://www.google.com/

可以给文字加上链接,链接的格式为 `[]()`,方括号内填写希望显示的文字,圆括号内填写该文字具体链接的网页地址。

例如,我们不可以访问[谷歌](https://www.google.com/)和 [YouTube](https://www.youtube.com)。直接书写网页地址也可以,
用 `<>` 包含网页,像这样,<https://www.google.com/>。

代码块与代码段#

Markdown 中可以写 inline code 以及 code block,inline code 使用一对 ` ( backtick 键)包含,sell = np.sin(time)。code block 使用三个 ` 开始与结 束。

import matplotlib
matplotlib.use('agg')
import matplotlib.pyplot as plt
import numpy as np

print("hello")
for i in range(10):

    print(i)

x = np.linspace(0, 4, 100)
y = np.sin(x)
fig, ax = plt.subplots()

ax.plot(x, y)
plt.savefig('test.png')

上述代码块源代码为

```
import matplotlib
matplotlib.use('agg')
import matplotlib.pyplot as plt
import numpy as np

print("hello")
for i in range(10):

    print(i)

x = np.linspace(0, 4, 100)
y = np.sin(x)
fig, ax = plt.subplots()

ax.plot(x, y)
plt.savefig('test.png')
```

图片#

可以在 Markdown 中使用图片,格式为 ![Image_caption](Image_link)。有两种方式 来引用图片:

  1. 本地图片:直接写上图片绝对路径或者相对当前 Markdown 文件的相对路径
  2. 网络图片:直接写上图片链接即可
这是一张网络图片

以上图片对应的源代码如下:

![这是一张网络图片](https://assets-cdn.github.com/images/modules/logos_page/Octocat.png)

注意点#

如果图片的链接为本地路径,Markdown 文件移动到其它地方,或者分享给他人以后,图片 将不能显示。可以使用一些图床1来存放图片,保 证在哪里都能显示图片。或者,尽量不在 Markdown 里使用图片。

表格#

Markdown 中也可以书写简单的表格:

姓名数学语文
张三12
李四34

生成上述表格的源代码为:

|姓名|数学|语文|
|---|---|---|
|张三| 1| 2 |
|李四| 3| 4 |

自己手写一个表格比较麻烦和枯燥,可以利用在线的工具,生成 Markdown 格式的表格, 一个不错的网站是 TableGenerator.

任务列表#

某些种类的 Markdown 还支持任务列表语法,例如:

  • 吃饭
  • [] 睡觉
  • 打怪兽
  • [] 写作业
  • [] 看电影

生成上述任务列表的源代码如下:

- [x] 吃饭
- [ ] 睡觉
- [x] 打怪兽
- [ ] 写作业
- [ ] 看电影

[] 中加上 x 表示某个任务已经完成,否则表示该任务进行中。

Markdown 源文件编辑与预览#

推荐几款编辑与预览的编辑器,VNote,Sublime Text 与 Visual Stuido Code

Vnote#

Vnote 是国人开发的 Markdown 笔记软件,专为 Markdown 设计,可以方便编写 Markdown 文件,进行预览,对文件进行管理等。

Visual Stuido Code#

安装 Visual Studio Code,VScode 原生支持 Markdown 文件预览,无需安装插件,按 Ctrl+K,再按 V,会在当前编辑窗口的右边打开文件 预览窗口,可以实时查看生成的 HTML 文件效果。更多指导,请查看 官方文档

Sublime Text#

安装 Sublime Text,并且安装插件 Markdown Preview

写好 Markdown 以后,直接使用快捷键 Ctrl+Shift+M 打开浏览器预览生成的 HTML 网页效 果。

参考资料#

  • Markdown cheatsheet:https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet#links
  • Markdown 官方文档:https://daringfireball.net/projects/markdown/