sass切換主題時,變數示例

2021-09-24 20:03:39 字數 702 閱讀 2797

data-theme 有兩個值分別為:[data-theme = 'wh-theme']和[data-theme = 'default-theme']

mixins.scss

// 預設主題的變數集合

$default-theme : (

base-color: #181d35,//背景色

text-color:#fff,//字型顏色

);// 武漢主題的變數集合

$wh-theme : (

base-color: #fff,//背景色

text-color:#000,//字型顏色

);//定義主題物件

$themes: (// key為主題 value為主題的變數集合

default-theme: $default-theme,

wh-theme: $wh-theme

);// 生成主題背景色樣式

@mixin base-background()'] &

}}// 生成主題字型色樣式

@mixin text-color()'] &

}}

main.scss

@import 'mixins.scss';

.bg.ibox-title

vue結合sass進行主題切換(完整簡單示例展示)

包含兩個scss檔案,乙個存主題樣式,乙個控制主題切換 測試頁面 測試 藍色紅色 主題scss頁面,themes.scss 定義全域性主題 顏色的map陣列,鑑於v5只有白天和晚上的主題,此處僅定義這兩種 切記 所有顏色一式兩份兒,務必保證key值統一,key值可以自定義,注意避免 之類的,與sas...

easyui切換主題

首先頁面肯定先導入easyui相關的 相關介面,我定義了乙個切換主題的 更換 default black bootstrap gray metro metro blue metro gray metro green metro red metro orange ui cupertino ui dar...

WordPress 主題切換

對於乙個喜歡把自己的部落格打扮的很酷或很靚,卻又不懂設計 的使用者來說.選擇 wordpress,就是選擇了幸福.選擇wordpress主題 選擇 wordpress 主題是一件比較累人的事情,因為主題太多太 多了,總想選乙個最好的,更好的,總想著 沒有最好,只有更好.我見過很多朋友,選的頭快 了也...