段落
在 Markdown 中以空行分割为段落，段落中的换行符会被忽略，所以如果要在段落内强制换行，得在末尾添加 2 个空格
段落 1
段落 2
被忽略的换行
在行末添加 2 个空格强制换行
段落 1
段落 2 被忽略的换行
在行末添加 2 个空格强制换行
行内样式
行内代码 <code>
增加的内容 <ins>
删除的内容 <s>
高亮的内容 <mark>
按键 <kbd>
`行内代码`
++增加的内容++
~~删除的内容~~
==高亮的内容==
<kbd>按键</kbd>
代码
```typescript
let a = 123
```
```diff
- System.Console.WriteLine("Hello, World!");
+ System.Console.WriteLine("Rock all night long!");
```
```bash
npm run build --dev && npm run up
```
```vue {data-line=1,2}
<template>
<div class="link-block">高亮行号</div>
</template>
```
let a = 123
- System.Console.WriteLine("Hello, World!");
+ System.Console.WriteLine("Rock all night long!");
npm run build --dev && npm run up
<template>
<div class="link-block">高亮行号</div>
</template>
本地视频
<video width="100%" height="100%" autoplay muted loop>
<source src="/blog/_assets/9c3ec644c3a6cc2a.mp4" type="video/mp4" autoplay>
</video>
iframe 嵌入
Bilibil 视频嵌入
在 src="...&bvid= 后填入 Bilibli 视频的 BV（地址里的BV开头）
<iframe
height="400"
width="600"
high_quality="1"
src="//player.bilibili.com/player.html?as_wide=1&high_quality=1&danmaku=0&bvid=BV1kb4y1m7e7"
allowfullscreen
></iframe>
Figma 嵌入
在 src="...&url= 后填入 Figma 文件的地址，注意要文件的权限要所有人可见，详细信息
<iframe
allowfullscreen
height="400"
width="600"
src="https://www.figma.com/embed?embed_host=astra&url=https://www.figma.com/file/3wdLeSnzTYqEtQ2muE8Bhp"
></iframe>
自定义块
::: warn 警告标题
请不要使用时间 warn
:::
::: warn
111 请不要使用时间 [vercel.com](https://vercel.com/docs/rest-api)
:::
::: tip
请不要使用时间 tip
:::
::: tip 安装说明
在 Windows 下按 <kbd>Ctrl + D</kbd> [vercel.com](https://vercel.com/docs/rest-api)
:::
::: info
请不要使用时间 info
:::
::: info 安装说明
在 Windows 下按 <kbd>Ctrl + D</kbd> [vercel.com](https://vercel.com/docs/rest-api)
:::
请不要使用时间 warn
111 请不要使用时间 vercel.com
请不要使用时间 tip
在 Windows 下按 Ctrl + D vercel.com
请不要使用时间 info
在 Windows 下按 Ctrl + D vercel.com
实例
代码
Svelte 的未来是边缘优先。通过将传统应用程序的最佳部分与单页应用程序的最佳部分相结合，我们可以构建“过渡应用程序”，提供令人愉悦的最终用户体验和出色的开发人员体验。
Vercel 是一个开放平台，致力于开发和支持使用起来令人愉悦的工具，并使开发人员能够为最终用户打造令人难以置信的体验。通过赞助 Svelte、Nuxt、Astro 等框架以及我们相信和使用的社区构建的库，我们正在帮助创建一个更好的 Web 生态系统。
运行 npm run dev 士大夫
我们对 Svelte 的未来感到兴奋，这是 2020 年写下的文字 并为开放生态系统中的其他框架创建模板以供效仿。了解为什么开发人员喜欢 Svelte 并立即在 Vercel 上试用 Svelte。我们期待与您共建 Svelte 的未来 Ctrl+C。
百度 1<template>
<div class="link-block">LinkBlock</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
let a = 123
let a = 123
- System.Console.WriteLine("Hello, World!");
+ System.Console.WriteLine("Rock all night long!");
import {
ArrayMaxSize,
IsArray,
IsBoolean,
IsNumber,
IsOptional,
IsString,
IsUUID,
MaxLength,
ValidateNested,
} from "class-validator"
import { Type } from "class-transformer"
export class DtoBlockSet {
@IsArray()
@ArrayMaxSize(1024)
@Type(() => DtoBlock)
@ValidateNested({ each: true })
blocks!: DtoBlock[]
@IsUUID()
parentId!: string
}
Advertisement :)
- pica - high quality and fast image resize in browser.
- babelfish - developer friendly i18n with plurals support and easy syntax.
You will like those projects!
import * as Avatar from "@radix-ui/react-avatar"
import * as Tooltip from "@radix-ui/react-tooltip"
export default () => (
<Tooltip.Root>
<Tooltip.Trigger>
<Avatar.Root>…</Avatar.Root>
</Tooltip.Trigger>
<Tooltip.Content side="top">
Tooltip content
<Tooltip.Arrow />
</Tooltip.Content>
</Tooltip.Root>
)
h1 Heading 8-)
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h2 Heading
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h3 Heading
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h3 一个很长的当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h3 2341234
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h4 Heading
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h5 Heading
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
h6 Heading
当近代西文的金属活字印刷术应用到中文的活字排版时，我们就已经有与此对应的称呼——「全身/半身」。这里的「身」即「字身」（body），在当年铅字印刷的全盛期，印刷行业人士都这么说，而不会用「全角/半角」这样一个外来词。
Horizontal Rules
Emphasis
This is bold text
This is bold text
This is italic text
This is italic text
Strikethrough
inline-code
Blockquotes
Blockquotes can also be nested...
Blockquotes can also be nested...
...by using additional greater-than signs right next to each other...
...or with spaces between arrows.
Lists
Unordered
- Create a list by starting a line with
+,-, or* - Sub-lists are made by indenting 2 spaces:
- Marker character change forces new list start:
- Ac tristique libero volutpat at
- Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Marker character change forces new list start:
- Very easy!
Ordered
-
Lorem ipsum dolor sit amet
-
Consectetur adipiscing elit
-
Integer molestie lorem at massa
-
You can use sequential numbers...
-
...or keep all the numbers as
1.
Start numbering with offset:
- foo
- bar
Code
Inline code
Indented code
// Some comments
line 1 of code
line 2 of code
line 3 of code
Block code "fences"
Sample text here...
Syntax highlighting
var foo = function (bar) {
return bar++
}
console.log(foo(5))
Tables
| Option | Description |
|---|---|
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
Right aligned columns
| Option | Description |
|---|---|
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
| 命令 | 描述 |
|---|---|
npm run dev |
生成时间撒打发放到. |
npm run build |
生成时间与空手而. |
npm run ts |
extension to be used for dest files. |
Links
Autoconverted link https://github.com/nodeca/pica (enable linkify to see)
Images
Like links, Images also have a footnote style syntax
With a reference later in the document defining the URL location:
Plugins
The killer feature of markdown-it is very effective support of
syntax plugins.
Emojies
Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum:
Shortcuts (emoticons): :-) :-( 8-) ;)
see how to change output with twemoji.
Subscript / Superscript
- 19^th^
- H~2~O
<ins>
Inserted text
<mark>
Marked text
Footnotes
Footnote 1 link[^first].
Footnote 2 link[^second].
Inline footnote^[Text of inline footnote] definition.
Duplicated footnote reference[^second].
[^first]: Footnote can have markup
and multiple paragraphs.
[^second]: Footnote text.
Definition lists
Term 1
: Definition 1 with lazy continuation.
Term 2 with inline markup
: Definition 2
{ some code, part of Definition 2 }
Third paragraph of definition 2.
Compact style:
Term 1 ~ Definition 1
Term 2 ~ Definition 2a ~ Definition 2b
Abbreviations
This is HTML abbreviation example.
It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on.
*[HTML]: Hyper Text Markup Language
Custom containers
请不要使用时间 warn
111 请不要使用时间 vercel.com
请不要使用时间 tip
在 Windows 下按 Ctrl + D vercel.com
请不要使用时间 info
在 Windows 下按 Ctrl + D vercel.com
