使用指南针编译 css 资源时出错

Question

您好，我正在尝试使用指南针转换以下内容，但我收到一个编译错误，指出“未定义的 mixin 背景图像”

#header_toolbar {
height: 40px;
/* The black toolbar gradient :) */
background: #313131; /* Old browsers */
@include background-image(linear-gradient(left top, #313131, #101010));
/*background: -moz-linear-gradient(top,  #313131 0%, #101010 100%); *//* FF3.6+ *//*
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#313131), color-stop(100%,#101010)); *//* Chrome,Safari4+ *//*
background: -webkit-linear-gradient(top,  #313131 0%,#101010 100%); *//* Chrome10+,Safari5.1+ *//*
background: -o-linear-gradient(top,  #313131 0%,#101010 100%); *//* Opera 11.10+ *//*
background: -ms-linear-gradient(top,  #313131 0%,#101010 100%); *//* IE10+ *//*
background: linear-gradient(top,  #313131 0%,#101010 100%); *//* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#313131', endColorstr='#101010',GradientType=0 ); /* IE6-9 */

}

宝石文件

# Gems used only for assets and not required
# in production environments by default.
group :assets do
  gem 'sass-rails',   '~> 3.2.3'
  gem 'coffee-rails', '~> 3.2.1'

  # See https://github.com/sstephenson/execjs#readme for more supported runtimes
  # gem 'therubyracer', :platform => :ruby

  gem 'uglifier', '>= 1.0.3'
  gem 'compass-rails'
  gem "compass", "~> 0.12.1"
end

Answer 1

你需要在你的 scss 中导入 mixin：

 @import "compass/css3/images"

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

在这里查看有关将您的导入放在一个位置而不是在每个 scss 文件中定义它们的想法：http://compass-style.org/help/tutorials/best_practices/