5

运行 Compass 0.12.7 (Alnilam) 我多次重复遇到此错误:

Running "compass:dev" (compass) task
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
Cannot determine the opposite position of: to
unchanged public/styles/sass/ie_only.scss
unchanged public/img/icons-s6ab39d30ab.png
overwrite public/styles/css/screen.css (2.484s)

我的渐变有问题,但是这里出了什么问题,我该如何缓解这个问题?

4

2 回答 2

2

我在使用 compass 0.12.7 的项目中遇到了同样的问题,不幸的是,这个问题只能通过更新 compass 来解决。linear-gradient使用位置值to right类似于以下示例中的 mixin 时会导致问题警告:

div {
  @include background(linear-gradient(to right, red, blue));
}

这将被编译成这样的东西(在你的问题中抛出错误):

div {
  background: -webkit-gradient(linear, to right, to left, color-stop(0%, #ff0000), color-stop(100%, #0000ff));
  background: -webkit-linear-gradient(to right, #ff0000, #0000ff);
  background: -moz-linear-gradient(to right, #ff0000, #0000ff);
  background: -o-linear-gradient(to right, #ff0000, #0000ff);
  background: linear-gradient(to right, #ff0000, #0000ff);
}

不幸的是,这是无效的 CSS 代码。正确的输出应该如下:

div {
  background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #ff0000), color-stop(100%, #0000ff));
  background: -moz-linear-gradient(left, #ff0000, #0000ff);
  background: -webkit-linear-gradient(left, #ff0000, #0000ff);
  background: linear-gradient(to right, #ff0000, #0000ff);
}

正如我之前所说,修复它的唯一方法是更新指南针。

于 2015-01-09T14:08:00.603 回答
0

如果你不能/不想更新你的 sass,你可以删除那个“to”属性。

默认的 sass 渐变是垂直的:

@include background(linear-gradient(red, blue));

要获得水平:

@include background(linear-gradient(90deg, red, blue));
于 2016-01-26T14:57:04.223 回答