我有一个图标文件夹,我使用指南针来精灵图像:
@import "compass/utilities/sprites";
@import "icons/*.png";
@include all-icons-sprites(true);
这是在 /stylesheets/global/icons.css.scss 文件中
现在,在 /stylesheets/application/index.css.scss 文件中我需要使用:
@extend .icons-foo;
我在 application/index.css.scss 中的 application/ 之前包含 global/ 文件夹:
/*
*= require_tree ../global
*= require_tree .
*/
但我有一个错误:
".bar" failed to @extend ".icons-foo". The selector ".icons-foo" was not found.
现在的解决方案是重复我在这篇文章中放在 application/index.css.scss 中的第一个块。
但是,如果我将手动“icons-foo”放入 DOM 元素的类中,则该类是匹配的并且可以工作......
如何不重复相同的指令?如何导入一次精灵并在其他文件中使用它们?