Markdown 常用语法

粗体、斜体、粗斜体

1.粗体

**粗体**
__粗体__

2.斜体

*斜体*
_斜体_

3.粗斜体

***粗斜体***
___粗斜体___
*__粗斜体__*
__*粗斜体*__
**_粗斜体_**
_**粗斜体**_

列表

  • 无序列表 1
    • 无序列表 1.1
      • 无序列表 1.1.1
  • 无序列表 2
  • 无序列表 3
- 无序列表 1
  - 无序列表 1.1
    - 无序列表 1.1.1
- 无序列表 2
- 无序列表 3
  1. 有序列表 1
    1. 有序列表 1.1
      1. 有序列表 1.1.1
  2. 有序列表 2
  3. 有序列表 3
1. 有序列表 1
   1. 有序列表 1.1
      1. 有序列表 1.1.1
2. 有序列表 2
3. 有序列表 3

引用

生命是一团欲望,欲望不能满足便痛苦,满足便无聊。

> 生命是一团欲望,欲望不能满足便痛苦,满足便无聊。

生命是一团欲望,欲望不能满足便痛苦,满足便无聊。

人生就在痛苦和无聊之间摇摆。

> 生命是一团欲望,欲望不能满足便痛苦,满足便无聊。
>
> > 人生就在痛苦和无聊之间摇摆。

分割线、删除线、下划线

人间忽晚,山河已秋。


桃李不言,下自成蹊。


祸不妄至,福不徒来。

人间忽晚,山河已秋。

---

桃李不言,下自成蹊。

***

祸不妄至,福不徒来。

我有自由的灵魂,却没有自由的人生。

~~我有自由的灵魂,却没有自由的人生。~~

除了生病之外,你所感受到的痛苦都是你的价值观带给你的,而非真实存在。

除了生病之外,你所感受到的痛苦都是你的价值观带给你的,而非真实存在。

链接、图片

https://github.com/fadeache

GitHub

Markdown 常用语法_第1张图片

Markdown 常用语法_第2张图片


[GitHub](https://github.com/fadeache)

![图片](https://img-blog.csdnimg.cn/img_convert/dbdf457ca374543ee6c30d8f17a1b21c.jpeg)

图片

表格

诗句 作者
小楼一夜听春雨,深巷明朝卖杏花。 陆游
晚来天欲雪,能饮一杯无。 白居易
| 诗句 | 作者 |
| --- | --- |
| 小楼一夜听春雨,深巷明朝卖杏花。 | 陆游 |
| 晚来天欲雪,能饮一杯无。 | 白居易 |
诗句 作者
小楼一夜听春雨,深巷明朝卖杏花。 陆游
晚来天欲雪,能饮一杯无。 白居易
| 诗句 | 作者 |
| :-- | :-- |
| 小楼一夜听春雨,深巷明朝卖杏花。 | 陆游 |
| 晚来天欲雪,能饮一杯无。 | 白居易 |
诗句 作者
小楼一夜听春雨,深巷明朝卖杏花。 陆游
晚来天欲雪,能饮一杯无。 白居易
| 诗句 | 作者 |
| --: | --: |
| 小楼一夜听春雨,深巷明朝卖杏花。 | 陆游 |
| 晚来天欲雪,能饮一杯无。 | 白居易 |
诗句 作者
小楼一夜听春雨,深巷明朝卖杏花。 陆游
晚来天欲雪,能饮一杯无。 白居易
| 诗句 | 作者 |
| :-: | :-: |
| 小楼一夜听春雨,深巷明朝卖杏花。 | 陆游 |
| 晚来天欲雪,能饮一杯无。 | 白居易 |

代码

app.mount("#app")

`app.mount("#app")`
import { createApp } from "vue";
import App from "./App.vue";
import pinia from "./store";
import router from "./router";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import * as ElIcons from "@element-plus/icons-vue";
import ICON from "./components/common/icon.vue";

const app = createApp(App);
for (const name in ElIcons) {
  app.component(name, ElIcons[name]);
}

app.use(pinia);
app.use(router);
app.use(ElementPlus);
app.component("ICON", ICON);

app.mount("#app");
```js
import { createApp } from "vue";
import App from "./App.vue";
import pinia from "./store";
import router from "./router";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import * as ElIcons from "@element-plus/icons-vue";
import ICON from "./components/common/icon.vue";

const app = createApp(App);
for (const name in ElIcons) {
  app.component(name, ElIcons[name]);
}

app.use(pinia);
app.use(router);
app.use(ElementPlus);
app.component("ICON", ICON);

app.mount("#app");
```

键盘

Ctrl+C AND Ctrl+V

Ctrl+C AND Ctrl+V

VuePress 关于 MarkDown 的拓展

内部链接

网站内部的链接,将会被转换成 用于 SPA 导航。同时,站内的每一个文件夹下的 README.md 或者 index.md 文件都会被自动编译为 index.html,对应的链接将被视为 /

以如下的文件结构为例:

.
├─ README.md
├─ foo
│ ├─ README.md
│ ├─ one.md
│ └─ two.md
└─ bar
├─ README.md
├─ three.md
└─ four.md

假设你现在在 foo/one.md 中:

[Home](/) 
[foo](/foo/) 
[foo heading](./#heading) 
[bar - three](../bar/three.md) 
[bar - four](../bar/four.html) 

Emoji

输入

:tada: :100:

输出

你可以在这个列表找到所有可用的 Emoji。

目录

输入

[[toc]]

输出

Markdown 常用语法_第3张图片

目录(Table of Contents)的渲染可以通过 markdown.toc 选项来配置。

自定义容器(默认主题)

输入

::: tip
这是一个提示
:::

::: warning
这是一个警告
:::

::: danger
这是一个危险警告
:::

::: details
这是一个详情块,在 IE / Edge 中不生效
:::

输出

Markdown 常用语法_第4张图片

你也可以自定义块中的标题:

::: danger STOP
危险区域,禁止通行
:::

::: details 点击查看代码

```js
console.log("你好,VuePress!");
```

:::

代码块中的行高亮

输入

```js {4}
export default {
  data () {
    return {
      msg: 'Highlighted!'
    }
  }
}
```

输出

export default {
  data() {
    return {
      msg: "Highlighted!",
    };
  },
};

除了单行以外,你也可指定多行,行数区间,或是两者都指定。

  • 行数区间: 例如 {5-8}, {3-10}, {10-17}
  • 多个单行: 例如 {4,7,9}
  • 行数区间与多个单行: 例如 {4,7-13,16,23-27,40}

你可能感兴趣的:(vue3,前端,编辑器,1024程序员节)