Vue中把常用的css样式分离出来，用自定义变量进行代替

1.定义方式
在src静态资源里新建.styl文件如：src/assets/styles/varibles.styl
内容如下：
// 定义变量    
$bgColor = #b3d4db;
2.使用方式

<style lang="stylus" scoped>
@import '~@styles/varibles.styl';// 引入

.container {
  background-color: $bgColor; // 使用
}
</style>

扩展知识
如何在css样式中引入外部样式

答:@import 'url' ,注意import前需要加@符号 @符号 @符号

Last modification：April 8th, 2019 at 05:43 pm

如果觉得我的文章对你有用，请随意赞赏

admin • 2026 年 Jan 月 Mon 日

1.定义方式
在src静态资源里新建.styl文件如：src/assets/styles/varibles.styl
内容如下：
// 定义变量    
$bgColor = #b3d4db;
2.使用方式

<style lang="stylus" scoped>
@import '~@styles/varibles.styl';// 引入

.container {
  background-color: $bgColor; // 使用
}
</style>

扩展知识
如何在css样式中引入外部样式

答:@import 'url' ,注意import前需要加@符号 @符号 @符号