markdown使用效果

一個人的王者發表於2020-10-16

效果 (原始碼

markdown

markdown標題

使用#號標記 1-6級標題

markdown段落

Markdown 段落沒有特殊的格式,直接編寫文字就好,段落的換行是使用兩個以上空格加上回車。
當然也可以在段落後面使用一個空行來表示重新開始一個段落。

字型

斜體文字
斜體文字
粗體文字
粗體文字
粗斜體文字
粗斜體文字

分割線

你可以在一行中用三個以上的星號、減號、底線來建立一個分隔線,行內不能有其他東西。你也可以在星號或是減號中間插入空格。下面每種寫法都可以建立分隔線:


刪除線

如果段落上的文字要新增刪除線,只需要在文字的兩端加上兩個波浪線 ~~ 即可

刪除線

腳註

腳註是對文字的補充說明
Markdown腳註的格式如下:
[^要註明的文字]

以下例項演示了腳註的用法

建立腳註格式類似這樣 1

markdown列表

有序列表 有序列表使用數字並加上 . 號來表示

  1. 2
  2. 3
  3. 4

無序列表 無序列表使用星號(*)、加號(+)或是減號(-)作為列表標記,這些標記後面要新增一個空格,然後再填寫內容:

  • 橘子
  • 香蕉
  • 蘋果

列表巢狀

列表巢狀只需在子列表中的選項前面新增四個空格即可:

  1. one
    • 橘子
    • 蘋果
  2. two
    • 西瓜
    • 菠蘿

區塊

Markdown 區塊引用是在段落開頭使用 > 符號 ,然後後面緊跟一個空格符號:

dog
duck
cat

另外區塊是可以巢狀的,一個 > 符號是最外層,兩個 > 符號是第一層巢狀,以此類推:

1

1.1

1.1.1

2

2.1

2.1.1

區塊中使用列表

  • 貂蟬
  • 西施
  • 楊玉環
  • 王昭君

列表中使用區塊

  • one

    C
    C++

  • two

    java
    python

markdown程式碼

如果是段落上的一個函式或片段的程式碼可以用反引號把它包起來(`)

print()函式

程式碼區塊

程式碼區塊使用4個空格或者一個製表符(Tab鍵)

<?php
echo 'helloworld'
>

你也可以用 ```包裹一段程式碼,並指定一種語言(也可以不指定)

$(document).ready(function(){
    alert('helloworld');
});

markdown連結

連結名稱
或者
<連結地址>
這是一個連結 菜鳥教程

https://www.runoob.com

高階連結

我們可以通過變數來設定一個連結,變數賦值在文件末尾進行:
這個連結用 1 作為網址變數 Google
這個連結用 runoob 作為網址變數 Runoob
然後在文件的結尾為變數賦值(網址)

Markdown

[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-I4pYkohy-1602783190560)(圖片地址)]
[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-HERIk9Zb-1602783190564)(圖片地址 “可選標題”)]
開頭一個感嘆號
接著一個方括號,裡面放上圖片替代的文字
接著一個普通括號,裡面放上圖片的網址,最後還可以用引號包住並加上選擇性的 ‘title’ 屬性的文字。

RUNOOB 圖示

[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片儲存下來直接上傳(img-YHWrQpy1-1602783190572)(http://static.runoob.com/images/runoob-logo.png “RUNOOB”)]
當然,你也可以像網址那樣對圖片網址使用變數:

這個連結用 1 作為網址變數 RUNOOB.
然後在文件的結尾為變數賦值(網址)

markdown表格

Markdown 製作表格使用 | 來分隔不同的單元格,使用 - 來分隔表頭和其他行。

表頭表頭
單元格單元格

對齊方式

-: 設定內容和標題欄居右對齊。
:- 設定內容和標題欄居左對齊。
:-: 設定內容和標題欄居中對齊。

左對齊。。。右對齊 。。。居中對齊
單元格單元格單元格
單元格單元格單元格

高階技巧

轉義

Markdown 使用了很多特殊符號來表示特定的意義,如果需要顯示特定的符號則需要使用轉義字元,Markdown 使用反斜槓轉義特殊字元
文字加粗
** 正常顯示星號 **

支援的HTML元素

不在 Markdown 涵蓋範圍之內的標籤,都可以直接在文件裡面用 HTML 撰寫。

目前支援的 HTML <kbd> <b> <i> <em> <sup> <sub> <br>等
使用 Ctrl+Alt+Del 重啟電腦

公式

當你需要在編輯器中插入數學公式時,可以使用兩個美元符 $$ 包裹 TeX 或 LaTeX 格式的數學公式來實現。提交後,問答和文章頁會根據需要載入 Mathjax 對數學公式進行渲染。
KaTeX parse error: Can't use function '$' in math mode at position 249: … \end{vmatrix} $̲{$tep1}{\style{…

a=1
a=2
方形
圓角
條件a
結果1
結果2
橫向流程圖
a=1
a=2
方形
圓角
條件a
結果1
結果2
豎向流程圖
Created with Raphaël 2.2.0 開始框 處理框 判斷框(是或否?) 輸入輸出框 結束框 子流程 yes no
Created with Raphaël 2.2.0 開始框 處理框 判斷框(是或否?) 輸入輸出框 結束框 子流程 yes no
物件A 物件B 物件B你好嗎?(請求) 物件B的描述 物件A的描述(提示) 我很好(響應) 你真的好嗎? 物件A 物件B 標題:複雜使用

物件A 物件B 小三 C 物件B你好嗎?(請求) 物件B的描述 物件A的描述(提示) 我很好(響應) 你好嗎 物件B找我了 你真的好嗎? 我們是朋友 沒人陪我玩 物件A 物件B 小三 C 標題:複雜使用

張三 李四 王五 王五你好嗎? 與疾病戰鬥 loop [健康檢查] 合理 食物 看醫生... 很好! 你怎麼樣? 很好! 張三 李四 王五 標題:複雜使用

%% 語法示例
        gantt
        dateFormat  YYYY-MM-DD
        title 軟體開發甘特圖
        section 設計
        需求                      :done,    des1, 2014-01-06,2014-01-08
        原型                      :active,  des2, 2014-01-09, 3d
        UI設計                     :         des3, after des2, 5d
    未來任務                     :         des4, after des3, 5d
        section 開發
        學習準備理解需求                      :crit, done, 2014-01-06,24h
        設計框架                             :crit, done, after des2, 2d
        開發                                 :crit, active, 3d
        未來任務                              :crit, 5d
        耍                                   :2d
        section 測試
        功能測試                              :active, a1, after des3, 3d
        壓力測試                               :after a1  , 20h
        測試報告                               : 48h

  1. 菜鳥教程 – 學的不僅是技術,更是夢想!!! ↩︎

相關文章