（六）更換面板主題

1.安裝主題工具

首先安裝「主題生成工具」，可以全域性安裝或者安裝在當前專案下，推薦安裝在專案裡，方便別人 clone 專案時能直接安裝依賴並啟動。

yarn add element-theme --dev

安裝白堊主題，可以從 npm 安裝或者從 github 拉取最新**，這裡從 npm 安裝。

yarn add element-theme-chalk -d

主題生成工具安裝成功後，如果全域性安裝可以在命令列裡通過et呼叫工具，如果安裝在當前目錄下，需要通過node_modules/.bin/et訪問到命令。執行-i初始化變數檔案。預設輸出到element-variables.scss，當然你可以傳引數指定檔案輸出目錄。

node_modules/.bin/et -i

命令執行成功之後，會在根目錄生成 scss檔案 element-variables.scss 。

4、修改主題色 

在 element-variables.scss 檔案裡修改 $–color-primary:#4b5f6e，即你想要的主題顏色

5、編譯主題 

執行主題編譯命令生成主題，根目錄會生成乙個theme的資料夾 。

6、引入自定義主題 

把生成的主題按顏色改名放置 src/theme 目錄下。

在 main.js 中 import 『所在路徑/index.css』。

7、效果展示

1. 在下圖位置新增封裝的換膚元件。

2.直接在元件中引用

在 home.vue 中引入

在語言切換左邊新增換膚元件

3.換膚測試

點選元件，選擇乙個顏色確定

我們看到相關主題顏色即刻生效

退回登入介面檢視

後端：前端：-ui.git

出處： 

extjs 更換面板

目標 了解3種辦法更換 內容 1，直接在當前瀏覽器更換 2，在當前瀏覽器更換 並儲存到cookle 3，在當前瀏覽器更換 並保持到config檔案 1.直接新增其他css檔案換膚.把 檔案解壓,把css檔案 如xtheme olive.css 拷貝到extjs的resources目錄下css資料夾裡...

ExtJs控制之更換面板

今天和大家分享乙個更換 的控制項，但是狠是失望，因為ext官方提供的css很粗糙，最好讓美工加以修改，不說了，如下.ext.ux.themecyclebutton ext.extend ext.cyclebutton,themevar style headvar head csspath是你放css...

C windowsFroms更換面板的簡單使用

在這裡我也與大家一起分享一下c windowsfroms的 的簡單更換與操作步驟 然後我們先建立乙個測試解決方案tessotf 接下還要在工具箱新增上 irisskin2.dll 控制項 我在這裡新增在常用項裡面，個人習慣 操作如圖 點選乙個 選擇項 就會出乙個對話方塊 如下圖 之前的準備工作我們就...