代码之家 › 专栏 › 技术社区 › Ahmed Aljaff

如何为特定css条件更改stylus变量

stylus vuetify.js right-to-left vue.js variables

Ahmed Aljaff · 技术社区 · 6 年前

我正在使用vuetify构建一个多语言vuejs web应用程序。

.application  
  &--is-rtl {
    background:gray !important
    $body-font-family = 'Droid Arabic Kufi', serif !important
  }

背景已成功更改,但字体变量未更改,请帮助我使此代码正常工作。提前谢谢。

1 回复 | 直到 6 年前

WhosDustin 6 年前

更改变量是一种层次结构情况。在更改变量的地方,只有更改后的类才会受到影响。

// No Change
.application 
  font-family $body-font-family
  &--is-rtl
    $body-font-family = 'Droid Arabic Kufi', serif

// Change
.application 
  font-family $body-font-family
  &--is-rtl
    $body-font-family = 'Droid Arabic Kufi', serif
    font-family $body-font-family !important

推荐文章

Miguel Morera · 在触针混音器中串联变量

7 年前

amp123 · 将ejs参数传递到触控笔文件

7 年前

fox · 在HTML容器中均匀分布任意数量的元素

7 年前

BeniaminoBaggins · 触笔-哈希导致错误

9 年前

Sim Sca · 触控笔通过循环创建混音

9 年前

Eric Sartorius · 悬停旋转时不需要的CSS多边形边框

9 年前

TheLazyChap · Gulp相关任务无法正常工作

9 年前

user1429980 · 如何在Stylus中生成占位符

10 年前

Ser-Gen · 如何生成与变量值同名的混合?

10 年前

Nano · Stylus给了我一个预期的“缩进”,得到了“突出”,但我不知道为什么

11 年前