breakpoints - 在断点处使用精灵无法正确运行

Question

当我在断点（$desktop）（susy）中使用精灵时，基因精灵背景图像不会影响我的.logo类

SCSS :

@include at-breakpoint($desktop) {
  .logo{
     @include logos-sprite('my-set-m');
  }
}

CSS :

.logos-sprite { background: url('../images/spr/logos.png') no-repeat; }

但是没有 at-breakpoint() 就可以了（.logo 与 .logo-sprite 合并）！（我需要将 sprite 包含到 brakpoint 中）

SCSS :

//@include at-breakpoint($desktop) {
  .logo{
     @include logos-sprite('my-set-m');
  }
//}

CSS :

.logos-sprite, .logo { background: url('../images/spr/logos.png') no-repeat; }

有什么解决办法吗？

Answer 1

那是因为@extend在媒体查询中不支持使用魔法精灵。您将不得不使用更精细的指南针精灵工具来创建自己的解决方法。