Markdown快速入門指南

前言與準備

  • 這份教程主要是在Typora編輯器中編寫的,其語法是基於GIthub的。但顯示效果與GIthub的有少許差異,基本上以針對GIthub,在語言上進行了修改。
  • 這份教程是基於GIthub的Markdown語法,GitHub Flavored Markdown
  • 教程仍在完善中,會繼續豐富更多的內容
  • 在不同編輯器中,也許顯示效果或者語法有稍許不同,耐心參考下編輯器提供的幫助文檔,或者Google下
  • 邊閱讀邊操作,可以獲得即時反饋,學習效率會更高。你可以下載Typora編輯器或者打開CSDN,登陸後點擊寫博客,可以立刻實戰,左邊是Markdown語法,後邊可以直接看到顯示結果,還是很棒的
  • Github: Markdown快速入門指南(推薦,鏈接部分的有些效果無法再CSDN演示,請見諒)

如何使用

面對一份教程,往往不知道該怎麼做?這份教程,目前內容還不是很多。推薦兩種使用方式:

  • 將其熟悉一遍,邊看邊做,基本可以掌握常用的一些語法了
  • 將這份教程當作工具書,需要使用什麼的時候,查閱什麼。比如,需要插入圖片的時候,可以從下面的目錄查找如何插入圖片(善用頁面查找,Ctrl+F

目錄

段落、換行:如何換行

標題:創建一級標題、二級標題之類的,爲了讓文章有主次之分,表示各部分之間的關係

引用:創建引用文字

列表:創建有序列表,就是123這樣的,或者無序列表

任務列表:在文字前面有個勾選框,一般記錄待辦事項

代碼:輸入代碼和代碼高亮

表格:創建表格

分割線:創建分割線

鏈接:鏈接到其他文件,其他標題,或者其他網址

鏈接網址

相對路徑:學會鏈接的必要知識

鏈接當前目錄文件

鏈接其他目錄文件

鏈接某一個標題

鏈接到某一個文件的某一個標題

插入圖片

斜體

加強(加粗)

符號指示:像這樣,就這樣

刪除線

開始

段落和換行符

段落,通常指的是一行或者多行連續的文本。

默認情況下,段落之間是以多個空行進行分隔的。我們只需要按下回車鍵 就可以完成段落分隔。
在這裏插入圖片描述

這是段落分隔

有些編輯器中,會忽略掉換行。進行換行操作的時候,可以使用Shift + 回車
在這裏插入圖片描述

這是換行

也許有的編輯器不支持,你可以嘗試在文字後面輸入兩個空格
在這裏插入圖片描述
或者輸入<br/>
在這裏插入圖片描述

標題

創建標題,可以在文本行的開頭輸入1-6個井號,#。不同個數的#,代表着標題的等級。就像在Word中,一個井號,#,代表着一級標題。兩個井號,##,代表着二級標題。

注意,#後面,要空一格再輸入標題

標題的顯示效果以及無空格的錯誤示範
在這裏插入圖片描述
所以大家記得要加空格

引用

引用,近些年在文章中使用的越來越多了。下面的顯示效果,你一定不陌生。

這是一段引用文字。

你只需要在文字前面輸入>就可以(最後在>後加空格,雖然有些編輯器會幫你補全這個空格)

> 這是一段引用文字。

注意,如果回車後不想繼續使用這個符號所代表的功能,再一次按下回車,如下

第一段引用

(回車後會這樣,但是不想引用了,可以繼續按下回車,這一行文字的引用就會消失)

列表

列表的話,分爲有序列表,和無序列表。

你可以使用*或者+,-來創建無序列表。

* 這是無序列表1
+ 這是無序列表2

顯示效果:

  • 這是無序列表1
  • 這是無序列表2

可以使用1.來創建有序列表,注意別少了那一點

1. 這是有序列表1
2. 這是有序列表2

顯示效果:

  1. 這是有序列表1
  2. 這是有序列表2

任務列表

任務列表就是在列表前面加一個符號,來表示列表事件是否完成。一般可以用來記錄待辦事項。

  • 待辦事項
  • 已辦事項

你可以使用- [ ]- [x]來表示待辦事項和已辦事項。

一般情況下,任務列表錢的方框是可以交互的,你可以鼠標點擊。

代碼如下:

- [ ] 待辦事項
- [x] 已辦事項

代碼塊

Github顯示代碼塊的符號與原始Markdown的有所不同。

但Github的這種方式在很多編輯器中都使用,因爲相對原來的表示方式,這種表示方式比較簡單

在Github中,你只需要輸入``` ,然後按下 回車。除此之外,我們可以在```後面加上代碼使用的語言,就會有代碼高亮。

def highlight():
    print('Ok, give you the highlighting')

這一段代碼可以這樣寫:

```python
def highlight():
    print('Ok, give you the highlighting')
```

`這個符號,在鍵盤的這個位置:
在這裏插入圖片描述
在英文狀態下,輸入即可。

在原始的Markdown中,使用<pre><code></code></pre>來表示代碼塊。在絕大多數的編輯器中都是支持的,但是使用過程相對比較麻煩。

<pre><code>
This is a code block.
</code></pre>

表格

使用表格的方法,相對有點複雜。不過也是有跡可循的。

表格一般由標題和內容組成。下圖中,紅色部分就是標題,藍色部分就是內容。Markdown語言,有點仿照表格的樣子。
在這裏插入圖片描述
表格是由橫線和豎線組成的。橫線和豎線,在鍵盤的這些位置:
在這裏插入圖片描述
同時,表格也是由行和列組成,我們可以用換行來表示行,那麼用什麼來表示列呢?

在表格中,是用豎線來表示列的。

現在,我們可以使用換行來表示行,豎線表示列,那麼如何區分標題和內容呢?

Markdown是使用橫線來區分標題和內容的。

所以,在Markdown中繪製表格,可以這樣寫:

| title 1| title 2|
|---------|---|
|content1| content2|
| content3 |content4|

顯示效果是這樣的:

title 1 title 2
content1 content2
content3 content4

你會發現:我寫的繪製表格的源碼,並不美觀。橫線的多少,豎線後要不要空格,這些都隨意。你看,它不是照樣顯示嘛

但,我們平時使用表格的時候,需要左對齊之類的。

| title 1| title 2|
|:-|---:|
|content1| content2|
| content3 |content4|

使用冒號來進行左對齊,居中和右對齊。左對齊的話,將冒號放在橫線的左邊,居中的話,將冒號放在橫線的兩端,右對齊的話,將冒號放在橫線的右端。

顯示效果如下:

title 1 title 2
content1 content2
content3 content4

水平線(分割線)

在知乎的回答中,經常會有分割線的出現(像這樣):


創建分割線,只需要輸入---或者***,然後按下回車就行了

鏈接

鏈接可以指:

  • 指向一個網址,比如:github
  • 可以指向另一個文件,比如:快速開始指南
  • 可以指向這個文件的某一個標題,比如:插入圖片
  • 甚至可以指向另一個文件的某一個標題,比如指向README文件中的如何使用

這些鏈接都有着統一的格式:

[需要創建鏈接的文字](鏈接地址)

鏈接文字是沒有限制的,所以上面四種鏈接的不同,在於鏈接地址的不同。

鏈接網址

如果指向一個網址,直接在小括號中直接輸入網址就可以了

比如第一個,指向一個網址,github

[github](www.github.com)

後面的三種,需要使用到路徑,一般是分爲絕對路徑和相對路徑的。

相對路徑,對於文件遷移來說更加友好

相對路徑

相對路徑,需要找一個參照物,來進行相對比較。這個參照物就是當前文件。

比如,我們這個文件叫SpanElement.md
在這裏插入圖片描述
這就相當於起點,接下來我們要根據指令形式。

鏈接當前目錄文件

如果我讓你找README,你可以直接找到。(鏈接的文件與當前文件在同一個目錄下,可以直接輸入名稱進行鏈接)。當然,我們也可以使用./,這個表示當前目錄。

比如第二個,可以指向另一個文件,比如:快速開始指南

[快速開始指南](QuickStart.md)或者[快速開始指南](./QuickStart.md)

鏈接其他目錄文件

比如,我們想獲取imgs文件夾中的pig01.png/表示下一級目錄。

現在我們站在這裏,給我們一個pig01.png,我們拿着這個指令,四處張望,沒有發現目標。

如果先告訴我們./imgsimgs,我們是可以找到imgs文件夾的。

然後我們站在imgs文件夾面前,發現如果想進去的話,還必須要一把鑰匙,這個鑰匙就是/。當我們進入imgs文件夾中,就可以找到pig01.png文件了。

所以可以表示爲:

./imgs/pig01.png或imgs/pig01.png

鏈接某一個標題

比如我們想鏈接上一個小標題,鏈接其他目錄文件,只要用在小括號中,在#後輸入標題的名稱就可以了

[鏈接到其他目錄](#鏈接其他目錄名稱)

顯示效果:

鏈接到其他目錄

鏈接到某一個文件的某一個標題

只需要先鏈接到某一文件,然後加上#標題就行了。就是進行一個組合,但這種方式,在其他編譯器中,不一定有用

比如我們想鏈接README.md文件中的如何使用

[如何使用](./README.md#如何使用)或[如何使用](README.md#如何使用)

顯示效果:

如何使用

插入圖片

插入圖片,是建立在鏈接的基礎上的。

在鏈接的語法基礎前,加上!進行區分即可。

![自定義圖片名字](圖片地址)
![wechat](imgs/wechat.jpg)

顯示效果:
在這裏插入圖片描述

斜體

在文字的兩端輸入*_,可以使文字變成斜體

*我要斜了*(推薦,不用切換中英文,適用面更廣)
_看我斜了_

顯示效果:

我要斜了
看我斜了

加強(加粗)

在文字的兩端輸入**__,可以使文字變成斜體

**我要粗了**(推薦,不用切換中英文,適用面更廣)
__看我粗了__

顯示效果:

我要粗了
看我粗了

符號指示

當我們需要強調一個符號或者一個函數的時候,可以在符號或者函數的兩端使用`。

`看我不一樣了`

顯示效果:

看我不一樣了

刪除線

在文字的兩端輸入~~,可以在文字上添加刪除線

~~我被刪除了~~

顯示效果:

我被刪除了

如果有興趣

公衆號:「土堆碎念」
一些不成熟的想法與碎念
一些無趣,精心打造的教程
一個不知所云的人

在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章