一、介紹
VS代碼(VS Code)是由微軟開發的一款輕量級代碼編輯器,支持多種編程語言。其擁有豐富的功能和插件架構,其中Markdown預覽功能是其中之一。本文將從多個方面詳細闡述VS Code的Markdown預覽功能。
二、基礎使用
有人或許會問:什麼是Markdown呢?Markdown是一種輕量級的標記語言,旨在讓寫作者專註於文本而不是排版樣式。在VS Code中撰寫Markdown文件後,按下Ctrl+Shift+V即可打開Markdown預覽窗口,預覽效果如下:
# 我是一級標題
## 我是二級標題
### 我是三級標題
我是普通文本
太陽 | 月亮
---- | ----
熱 | 冷
白天 | 黑夜
**我是粗體字**
*我是斜體字*
Markdown預覽的顯示效果如下:
我是一級標題
我是二級標題
我是三級標題
我是普通文本
太陽 | 月亮 |
---|---|
熱 | 冷 |
白天 | 黑夜 |
我是粗體字
我是斜體字
三、自定義CSS文件
Markdown預覽中的樣式可以通過自定義CSS文件進行修改。方法如下:
- 新建一個.css文件;
- 將自定義的樣式寫入.css文件中;
- 在VS Code的設置界面(File -> Preferences -> Settings)搜索Markdown.styles,在「User」欄目中填入自定義的.css文件路徑,如下圖所示:
"markdown.styles": [
"自定義的.css路徑"
]
預覽效果如下,自定義了
標籤的字體顏色為紅色:
<h1>我是一級標題</h1>
<h2>我是二級標題</h2>
<h3>我是三級標題</h3>
<p style="color:red">我是自定義顏色的段落內容</p>
我是一級標題
我是二級標題
我是三級標題
我是自定義顏色的段落內容
四、代碼塊高亮
在Markdown預覽中,我們可以使用三個反引號「“`」將代碼進行包裹,實現代碼塊的顯示。而且,代碼塊還能夠進行高亮顯示:
```python
# 這是python代碼塊
def test():
print("Hello World!")
```
預覽效果如下:
“`python
# 這是python代碼塊
def test():
print(“Hello World!”)
“`
五、數學公式支持
在Markdown預覽中,VS Code還支持MathJax插件,實現數學公式的支持:
<del>公式1:$$\int_0^1 x^2 \mathrm{d}x$$ </del>
公式2:$$\frac{1}{1+\frac{1}{x}}$$
公式3:$$(a+b)^2 = a^2+2ab+b^2$$
預覽效果如下:
公式1:$$\int_0^1 x^2 \mathrm{d}x$$
公式2:$$\frac{1}{1+\frac{1}{x}}$$
公式3:$$(a+b)^2 = a^2+2ab+b^2$$
原創文章,作者:YZVUP,如若轉載,請註明出處:https://www.506064.com/zh-hk/n/331880.html