CSS变量实现换肤功能```CSS /** css * :root里面是设置全局的css变量，每一个css选择器都能使用


/** css 
 * :root里面是设置全局的css变量，每一个css选择器都能使用 
 */
 
:root{
  --theme:#fff;
}

/** 
 * 当然，也可以局部声明css变量
 * 用var()来使用css变量
 */
 
.main{
  --color:red;
  background-color:var(--theme);
  color:var(--color)
}

<!-- 基于Vue -->

<div class="main" @click="handleChangeTheme">点我换肤</div>


// js部分
methods:{
  handleChangeTheme(){
    // 括号里前为css变量，后为更改的属性值
    document.body.style.setProperty('--theme','#000'); 
  }
}