主題功能 · EasyWeb開發文檔3

# 主題功能 ## 9.1.主題功能默認的樣式以及內置的幾套主題都在admin.css中，如果要自定義主題步驟如下： 1. 前往[主題生成器](https://demo.easyweb.vip/theme.html)在線定制主題； 2. 將生成的css放在admin.css里面，也可以像admin.css一樣引入，可以直接通過`<style>`寫在頁面中，也可以建一個`theme-all.css`引入，將所有生成的主題都放在這個css文件里面； 3. 打開“page/tpl/tpl-theme.html”添加生成的主題： ~~~ <div class="more-theme-list">  <div class="more-theme-item" data-theme="theme-cyan"> <img src="assets/module/img/theme-cyan.png"/> </div> </div> ~~~ 主題的預覽圖在主題生成器中會生成，右鍵可保存為圖片，`theme-all.css`最好在admin.css之后引入。 **設置默認主題也會閃一下才會切換怎么辦：** 因為主題切換是通過js切換的，js都是在css、html加在完畢之后執行的，有一點點延遲也很正常，而且換主題是換class，大部分組件都寫有transition的0.3s的css過渡效果，解決辦法只能是直接在index.html的`body`上面加上主題對應的class： ~~~ <body class="theme-red" data-theme="theme-red"></body> ~~~ 或者直接修改下主題的css，把前面的`.theme-xxx`改成body，這種方法只適合固定一套主題不需要切換的情況。