我可以在 <style> 部分使用全局常量吗？

【问题标题】：can I use global constant in <style> section?我可以在 <style> 部分使用全局常量吗？
【发布时间】：2020-07-17 22:03:36
【问题描述】：

我想为 css 样式使用全局常量。例如，

表 td { 边框：1px 纯色 }

我可以在配置文件等其他文件中定义 mycolor 吗？这样我就可以按颜色主题更改实际颜色。

【问题讨论】：

【解决方案1】：

我相信您的意思是全局 CSS 变量，是的，您可以，但请注意浏览器支持。如果您使用的是 SCSS 等预处理器，您也可以定义和共享变量。

:root {
  --color: red;
}

还有你的 Vue 组件样式块：

<style>
.some-class {
  color: var(--color);
}
</style>

SCSS 示例

$color: red;

还有你的 Vue 组件样式块：

<style lang="scss">
@import "~/assets/vars.scss";

.some-class {
  color: $color;
}
</style>

【讨论】：