返回介绍

文件嵌入 (new)

发布于 2020-11-22 06:30:30 字数 5266 浏览 1334 评论 0 收藏 0

docsify 4.6 开始支持嵌入任何类型的文件到文档里。你可以将文件当成 iframevideoaudio 或者 code block,如果是 Markdown 文件,甚至可以直接插入到当前文档里。

这是一个嵌入 Markdown 文件的例子。

[filename](_media/example.md ':include')

example.md 文件的内容将会直接显示在这里

filename

你可以查看 example.md 原始内容对比效果。

通常情况下,这样的语法将会被当作链接处理。但是在 docsify 里,如果你添加一个 :include 选项,它就会被当作文件嵌入。

嵌入的类型

当前,嵌入的类型是通过文件后缀自动识别的,这是目前支持的类型:

  • iframe .html, .htm
  • markdown .markdown, .md
  • audio .mp3
  • video .mp4, .ogg
  • code other file extension

当然,你也可以强制设置嵌入类型。例如你想将 Markdown 文件当作一个 code block 嵌入。

[filename](_media/example.md ':include :type=code')

你会看到:

filename

嵌入代码片段

有时候你并不想嵌入整个文件,可能你只想要其中的几行代码,但你还要在 CI 系统中编译和测试该文件。

[filename](_media/example.js ':include :type=code :fragment=demo')

在你的代码文件中,你需要用斜线 /// [demo] 包裹该片段(片段的前后都要有)。 你也可以使用 ### [demo] 来包裹。

示例:

filename

标签属性

如果你嵌入文件是一个 iframeaudio 或者 video,你可以给这些标签设置属性。

[cinwell website](https://cinwell.com ':include :type=iframe width=100% height=400px')

cinwell website

看见没?你只需要直接写属性就好了,每个标签有哪些属性建议你查看 MDN 文档

代码块高亮

如果是嵌入一个代码块,你可以设置高亮的语言,或者让它自动识别。这里是手动设置高亮语言

[](_media/example.html ':include :type=code text')

⬇️

如何高亮代码?你可以查看这份文档.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文