Docsify 主题

来自泡泡学习笔记
BrainBs讨论 | 贡献2023年7月26日 (三) 09:01的版本 (创建页面,内容为“= 主题 = 目前提供了一些主题,包括官方和社区制作的。模仿 Vuebuble 官网订制的主题样式,还有 [https://github.com/liril-net @liril-net] 贡献的黑色风格的主题等。 <pre lang="html"><link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/vue.css"> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/buble.css"> <link rel="stylesheet" href="//cdn.jsdelivr.…”)
(差异) ←上一版本 | 最后版本 (差异) | 下一版本→ (差异)
跳到导航 跳到搜索

主题

目前提供了一些主题,包括官方和社区制作的。模仿 Vuebuble 官网订制的主题样式,还有 @liril-net 贡献的黑色风格的主题等。

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/vue.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/buble.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/dark.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/pure.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/dolphin.css">

!> CSS 的压缩文件位于 /lib/themes/

<!-- compressed -->

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/vue.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/buble.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/dark.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/pure.css">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/dolphin.css">

如果你有其他想法或者想开发别的主题,欢迎提 PR

点击切换主题

<a data-theme="vue">vue.css</a> <a data-theme="buble">buble.css</a> <a data-theme="dark">dark.css</a> <a data-theme="pure">pure.css</a> <a data-theme="dolphin">dolphin.css</a>


<style>

 .demo-theme-preview a {
   padding-right: 10px;
 }
 .demo-theme-preview a:hover {
   cursor: pointer;
   text-decoration: underline;
 }

</style> <script>

 var preview = Docsify.dom.find('.demo-theme-preview');
 var themes = Docsify.dom.findAll('[rel="stylesheet"]');
 preview.onclick = function (e) {
   var title = e.target.getAttribute('data-theme')
   themes.forEach(function (theme) {
     theme.disabled = theme.title !== title
   });
 };

</script>

其他主题