返回介绍

Prism

发布于 2024-10-04 20:04:44 字数 1626 浏览 0 评论 0 收藏 0

使用 Prism.js 为语法添加高亮显示,开启插件时需要将 highlight 插件去掉。

该插件自带的主题样式较少,可以再安装 prism-themes 插件,里面多提供了几种样式。

[!TIP|style:flat|iconVisibility:hidden|labelVisibility:hidden] npm install gitbook-plugin-prism

https://github.com/gaearon/gitbook-plugin-prism

{
    "plugins": [
        "prism",
        "-highlight"
    ],
    "pluginsConfig": {
        "prism": {
            "css": [
                "prismjs/themes/prism-solarizedlight.css"
            ]
        }
    }
}

如果需要修改背景色、字体大小等,可以在 website.css 定义 pre[class*="language-"] 类来修改,下面是一个示例:

pre[class*="language-"] {
    border: none;
    background-color: #f7f7f7;
    font-size: 1em;
    line-height: 1.2em;
}

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

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

发布评论

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