在App.vue中配置
:root {
/* 背景色 */
/* --theme_bg_color: #000; */
--theme_bg_color: #fff;
//字体颜色
--theme-wz-color:#000;
/* --theme-wz-color:#fff; */
//div盒子颜色
--theme-div-color:#181818;
/* --theme-div-color:#fff; */
}
在子页面直接引用
page{
background: var(--theme_bg_color);//使用全局变量
}
.pageback{
background: var(--theme_bg_color);
}
//设置字体样式,直接写在class里,例如class="box wxcolor"
.wzcolor{
color: var(--theme-wz-color);
}
//盒子样式
.divitheme{
background: var(--theme-div-color);
border-radius: 10px;
height: 128px;
}
盒子效果