CSDN寫部落格
CSDN寫部落格使用的是MarkDown編輯器,使用過vscode的同學也都了解,這款編輯器能對代碼有很好的诠釋,是一款适合技術人的編輯器,今天對這款編輯器做一個大緻的介紹,友善第一次使用的同學們做個入門.
基礎格式
一.标題
标題是由#開頭,#号的多少代表标題的層級關系,具體如下:
# 一級标題
## 二級标題
.....
注意 : #與後面的标題中間隔了一個空格,而且必須置前才會生效,#号越多層級越小.1
二.文本樣式
文本是當做普通文本内容顯示,占文章的主要部分,使用者可以對文本進行修飾,來側重表現其重要性差別,強調性.
- 強調
- 加粗
- 标記
- 删除
- 引用
強調
強調文本用兩種格式: *強調文本* _強調文本_
使用後會使文本變成斜體格式,注重強調作用,效果如下:
強調文本也必須是頂格使用
加粗
加粗文本也是兩種格式: **加粗文本** __加粗文本__
使用後會使文本變成粗體格式,效果如下:
加粗文本加粗效果
标記
标記文本格式: ==标記文本==
使用後會使文本顔色改變,效果如下:
标記文本格式
删除
删除文本格式: ~~删除文本~~
使用後會在文本加一個橫線,表示删除效果:
删除文本效果
引用
引用文本格式: >引用文本
使用後效果如下:
引用文本
注意: 文本裡面可能有很多的數字字元,類似于H2O,210這種,可以通過下面所述表示:
數字元号
數字元号下标: H~2~O
數字元号上标: 2^10^
三.清單
清單可以用兩種格式:一種是層級關系,另一種是并列關系
并列又有兩種方式,數字并列和符号并列
- 并列
- 數字并列
- 符号并列
- 層級
并列
并列有數字開始并列,還有符号開始并列,格式如下:
數字并列:
1. 項目一
2. 項目二
...
符号并列:
* 項目一
* 項目二
...
使用效果如下:
- 項目一
- 項目二
- 項目三
- 項目一
- 項目二
- 項目三
層級
層級關系可以随着關系深入,格式如下
- 項目
* 項目
* 項目
...
效果如下:
- 項目
- 項目
- 項目
- 項目
注意:另外還有任務安排計劃顯示
- 計劃任務
- 完成任務
基礎加強
先來熟悉一下快捷鍵:
撤銷:Ctrl/Command + Z
重做:Ctrl/Command + Y
加粗:Ctrl/Command + B
斜體:Ctrl/Command + I
标題:Ctrl/Command + Shift + H
無序清單:Ctrl/Command + Shift + U
有序清單:Ctrl/Command + Shift + O
檢查清單:Ctrl/Command + Shift + C
插入代碼:Ctrl/Command + Shift + K
插傳入連結接:Ctrl/Command + Shift + L
插入圖檔:Ctrl/Command + Shift + G
查找:Command + F
替換:Command + G
在使用過程中使用快捷鍵能提高使用效率,多多使用就好了.
一.連結
連結是當我們需要顯示圖檔的時候,把我們的圖檔連結放在上面,就可以顯示出來.
連結形式: [link](https://mp.csdn.net)
圖檔形式: ![Alt](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9hdmF0YXIuY3Nkbi5uZXQvNy83L0IvMV9yYWxmX2h4MTYzY29tLmpwZw)
帶尺寸的圖檔形式:![Alt](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9hdmF0YXIuY3Nkbi5uZXQvNy83L0IvMV9yYWxmX2h4MTYzY29tLmpwZw =30x30)
居中的圖檔: ![Alt](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9hdmF0YXIuY3Nkbi5uZXQvNy83L0IvMV9yYWxmX2h4MTYzY29tLmpwZw#pic_center)
居中并且帶尺寸的圖檔: ![Alt](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9hdmF0YXIuY3Nkbi5uZXQvNy83L0IvMV9yYWxmX2h4MTYzY29tLmpwZw#pic_center =30x30)
效果如下:
link
二.代碼片
Java代碼塊:
```
public void static main(String[] args){
System.out.printf("hello world");
}
```
javaScript代碼塊:
```javascript
var arg = 10;
var bar = "bar";
```
效果如下:
public void static main(String[] args){
System.out.println("hello world");
}
var arg = 10;
var bar = "bar";
三.表格
表格對于可視化界面來說是個很直覺的顯示方式,對于資料庫表的展示使用表格是最好不過了,格式如下
項目 | Value
-------- | -----
電腦 | $1600
手機 | $12
導管 | $1
| Column 1 | Column 2 |
|:--------:| -------------:|
| centered 文本居中 | right-aligned 文本居右 |
使用效果如下:
項目 | Value |
---|---|
電腦 | $1600 |
手機 | $12 |
導管 | $1 |
Column 1 | Column 2 |
---|---|
centered 文本居中 | right-aligned 文本居右 |
注意:當冒号都存在時表示是居中顯示,隻有一個時,哪個存在表示靠哪裡顯示
自定義清單
格式如下:
Markdown
: Text-to-HTML conversion tool
Authors
: John
效果如下:
- Markdown
- Text-to-HTML conversion tool Authors
- John
- Luke
- Luke
四.數學公式
數學公式在文本裡面的顯示效果影響閱讀,是以應該把數學公式單獨顯示,以便使用者閱讀.
格式如下:
Gamma公式展示
$\Gamma(n) = (n-1)!\quad\foralln\in\mathbb N$ 是通過 Euler integral
$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$
效果如下:
Gamma公式展示 Γ ( n ) = ( n − 1 ) ! ∀ n ∈ N \Gamma(n) = (n-1)!\quad\forall n\in\mathbb N Γ(n)=(n−1)!∀n∈N 是通過 Euler integral
Γ ( z ) = ∫ 0 ∞ t z − 1 e − t d t . \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. Γ(z)=∫0∞tz−1e−tdt.
注意:通過在數學公式兩邊加上$$來表示數學公式參考文檔
進階進階
圖檔
1.插入甘特圖
格式如下:
```mermaid
gantt
dateFormat YYYY-MM-DD
title Adding GANTT diagram functionality to mermaid
section 現有任務
已完成 :done, des1, 2014-01-06,2014-01-08
進行中 :active, des2, 2014-01-09, 3d
計劃中 : des3, after des2, 5d
```
效果如下:
注意:甘特圖的參考文檔
2.插入UML圖
格式如下:
```mermaid
sequenceDiagram
張三 ->> 李四: 你好!李四, 最近怎麼樣?
李四-->>王五: 你最近怎麼樣,王五?
李四--x 張三: 我很好,謝謝!
李四-x 王五: 我很好,謝謝!
Note right of 王五: 李四想了很長時間, 文字太長了<br/>不适合放在一行.
李四-->>張三: 打量着王五...
張三->>王五: 很好... 王五, 你怎麼樣?
```
效果如下:
注意:UML圖的參考文檔
3.插入Mermaid流程圖
格式如下:
```mermaid
graph LR
A[長方形] -- 連結 --> B((圓))
A --> C(圓角長方形)
B --> D{菱形}
C --> D
```
效果如下:
注意:Mermaid流程圖的參考文檔
4.插入Flowchart流程圖
格式如下:
```mermaid
flowchat
st=>start: 開始
e=>end: 結束
op=>operation: 我的操作
cond=>condition: 确認?
st->op->cond
cond(yes)->e
cond(no)->op
```
效果如下:
注意:Flowchart流程圖的參考文檔
以上基本就是CSDN寫部落格需要的技巧了,想寫部落格的同學可以參考一下,寫部落格是一個很好的開始,希望同學們能在技術上越走越好,能分享更多更好的文章.
- 标題後面是一個文本概述内容,裡面不能用任何的文本格式. ↩︎