ups国际快递网站建设,国外网站 dns,东莞南城网站建设公司怎么样,校园网站建设平台目录 1.添加theme样式文件2.引入样式文件3.使用变量设置css样式4.设置主题样式5.切换方法 1.添加theme样式文件 文件内容如下#xff1a;
html[data-themelight]{--text-color: #000000;/* 写需要切换的样式 */
}
html[data-themedark]{--text-color… 目录 1.添加theme样式文件2.引入样式文件3.使用变量设置css样式4.设置主题样式5.切换方法 1.添加theme样式文件 文件内容如下
html[data-themelight]{--text-color: #000000;/* 写需要切换的样式 */
}
html[data-themedark]{--text-color: #ffffff;/* 写需要切换的样式 */
}
2.引入样式文件
在main.js中引入文件
import ./styles/theme.css3.使用变量设置css样式
使用var(自定义的变量名)来设置动态的css样式
.text {color: var(--text-color);}4.设置主题样式
在index.html文件里设置默认样式
5.切换方法
button clickchangeTheme切换/button
const theme ref(dark)
const changeTheme () {document.documentElement.setAttribute(data-theme, theme.value dark ? light : dark)theme.value theme.value dark ? light : dark
}
