css - 如何使用 Compass 过滤器 mixin？

Question

我正在尝试在 SCSS 中以这种方式使用过滤器混合：

a {
  @include filter(grayscale(100%));
}

但是当我编译时，我得到了这个错误：

Undefined mixin 'filter'.

我正在使用这个带有 Rails 框架的 Gem 的最新版本。

http://compass-style.org/reference/compass/css3/filter/

Answer 1

SASS 示例

@import 'compass/css3/filter'

.filtered
  @include filter(grayscale(50%))
  @include filter(blur(2px))

Answer 2

您需要先导入指南针过滤器。

要使用多个过滤器，请将所有过滤器放在 filter() 中，不带逗号

@import 'compass/css3/filter'

// multiple calls like this:
.filtered {
    @include filter(blur(4px) brightness(1.3) saturate(1.5));
}

Answer 3

根据Compass 文档，这个文件可以使用：@import "compass/css3/filter"在 sass 文件的顶部导入。

然后在 sass 文件中，您可以将其用作

filter($filter-1, $filter-2, $filter-3, $filter-4, $filter-5, $filter-6, $filter-7, $filter-8, $filter-9, $filter-10)