Markdown 拓展

最后更新于:

试试右下角的主题颜色切换

TODO 列表

  • [ ] 吃饭
  • [ ] 睡觉
  • [x] 打豆豆

导航卡片

::: navCard 2

 1- name: 百度
 2  desc: 百度——全球最大的中文搜索引擎及最大的中文网站,全球领先的人工智能公司
 3  link: http://www.baidu.com/
 4  img: https://img.tukuppt.com/png_preview/00/10/46/IHk8cns6Re.jpg!/fw/780
 5  badge: 搜索引擎
 6- name: Google
 7  desc: 全球最大的搜索引擎公司
 8  link: http://www.google.com/
 9  img: https://ts1.cn.mm.bing.net/th/id/R-C.58c0f536ec073452434270fb559c3f8c?rik=SnOUNtUtPLX6ww&riu=http%3a%2f%2fwww.sz4a.cn%2fPublic%2fUploads%2fimage%2f20230303%2f1677839482835474.png&ehk=J1lqoeszPGEWzDOSZQ3JxzXsklfd0QzgrJu6ZVvESKk%3d&risl=&pid=ImgRaw&r=0
10  badge: 搜索引擎
11  badgeType: tip

:::

分享卡片

::: shareCard 3

 1- name: George Chan
 2  desc: 让我给你讲讲他的传奇故事吧
 3  avatar: https://z3.ax1x.com/2021/09/30/4oKMVI.jpg
 4  link: https://cyc0819.top/
 5  bgColor: "#FFB6C1"
 6  textColor: "#621529"
 7
 8- name: butcher2000
 9  desc: 即使再小的帆,也能远航
10  avatar: https://jsd.cdn.zzko.cn/gh/Kele-Bingtang/static/user/20211029181901.png
11  link: https://blog.csdn.net/weixin_46827107
12  bgColor: "#CBEAFA"
13  textColor: "#6854A1"
14
15- name: Evan's blog
16  desc: 前端的小学生
17  avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg
18  link: https://xugaoyi.com/
19  bgColor: "#B9D59C"
20  textColor: "#3B551F"
21
22- name: 二丫讲梵
23  desc: 💻学习📝记录🔗分享
24  avatar: https://wiki.eryajf.net/img/logo.png
25  link: https://wiki.eryajf.net/
26  bgColor: "#FBEBEC"
27  textColor: "#603420"

:::

图文卡片

::: imgCard

 1- img: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200529162253.jpg
 2  link: https://xugaoyi.com/
 3  name: 标题
 4  desc: 描述内容描述内容描述内容描述内容 # 描述,可选
 5  author: Evan Xu # 作者,可选
 6  avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg # 头像,可选
 7- img: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200530100256.jpg
 8  link: https://xugaoyi.com/
 9  name: 标题
10  desc: 描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容
11  author: Evan Xu
12  avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg
13- img: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200530100257.jpg
14  link: https://xugaoyi.com/
15  name: 标题
16  desc: 描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容
17  author: Evan Xu
18  avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg

:::

图文卡片配置风格

::: imgCard

 1config:
 2  cardNum: 2 # 【每行显示的卡片数量,默认为 3】,可在容器名字后面添加,如 ::: imgCard 2。导航卡片和分享卡片都支持该配置项
 3  target: _blank # 【跳转方式,默认为 _blank,仅支持 _blank | _self】。导航卡片和分享卡片都支持该配置项
 4  lineClamp: 2 # 【显示描述信息的行数,默认为 2】。导航卡片支持该配置项,分享卡片不支持
 5  cardGap: 10 # 【每行卡片之间的间隔,默认为 20】。导航卡片和分享卡片都支持该配置项
 6  imgHeight: 200px # 【图片宽度,默认为 auto】。仅图文卡片支持该配置项
 7  objectFit: fill # 【设置图片的填充方式,支持 cover | fill | contain | scale-down | none,默认为 cover】。仅图文卡片支持该配置项
 8  showCode: true # 【是否显示代码块,默认为 false】。导航卡片和分享卡片都支持该配置项
 9
10data:
11  - img: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200529162253.jpg
12    link: https://xugaoyi.com/
13    name: 标题
14    desc: 描述内容描述内容描述内容描述内容 # 描述,可选
15    author: Evan Xu # 作者,可选
16    avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg # 头像,可选
17  - img: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200530100256.jpg
18    link: https://xugaoyi.com/
19    name: 标题
20    desc: 描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容
21    author: Evan Xu
22    avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg
23  - img: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200530100257.jpg
24    link: https://xugaoyi.com/
25    name: 标题
26    desc: 描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容
27    author: Evan Xu
28    avatar: https://jsd.cdn.zzko.cn/gh/xugaoyi/image_store/blog/20200103123203.jpg

:::

mark 标签

<mark></mark> 标签,可以添加高亮效果。

效果:

  • Teek

使用:

1-
2<mark>Teek</mark>

Teek 内置容器

NOTE 容器

::: note 这是一个 note 容器 :::

内容居中容器

::: center 测试 Center :::

::: center

测试标题

(测试二级标题) :::

内容居右容器

居右的内容字体为 14px

::: right 测试 right :::

::: note 摘要

很久之前,我决定踏上的这条路,映照了我与未来的因果。

::: right

2021-11-13 @Teek

:::

VP 容器风格

::: info 这是一个 info 容器 :::

::: tip 这是一个 tip 容器 :::

::: warning 这是一个 warning 容器 :::

::: danger 这是一个 danger 容器 :::

::: details 这是一个 details 容器 :::

Github 容器风格

强调用户在快速浏览文档时也不应忽略的重要信息。

有助于用户更顺利达成目标的建议性信息。

对用户达成目标至关重要的信息。

因为可能存在风险,所以需要用户立即关注的关键内容。

行为可能带来的负面影响。

推荐使用微信支付
微信支付二维码
推荐使用支付宝
支付宝二维码
最新文章

文档导航

此分类暂无内容