使用COMPASS进行响应式网站设计

Question

我正在尝试学习自适应网站设计，并且已经通过将.scss file编译为.css文件来掌握Sass的概念。现在，我正在尝试学习如何使用compass。

我已经安装了Ruby和Compass。我在文件夹中创建了一个新的compass project。

所以现在当我尝试编译我的styles.scss时，出现此错误：

Change detected to: scss/styles.scss
error scss.styles.scss (Line 1: File to import not found or unreadable: compass/css3/images.)
Load path: D:/Demo/scss)

我正在尝试自学编码。我知道一些HTML和CSS，但我想使用自适应网站设计来提高自己的游戏水平。所以我拿起这本书来自学。 https://www.amazon.com/gp/product/1783550236/ref=oh_aui_detailpage_o01_s00?ie=UTF8&psc=1。

styles.scss中的代码如下所示：

@import "compass/css3/images";

header {
    @include background-image(linear-gradient(red, blue));
}

$brandBue: #416e8e;
.generic-Container {
    padding: 10px;
    border: $brandBlue 1px solid;
    background: #ccc;
    box-shadow: 1px 1px 1px rgba(black, .3);
}

.box-customer-service {
    @extend .generic-container;
    padding: 25px;
}

*, *:before, *:after {
    background-image: -webkit-linear-gradient(red, blue);
    background-image: -moz-linear-gradient(red, blue);
    background-image: -ms-linear-gradient(red, blue);
    background-image: -o-linear-gradient(red, blue);
    background-image: linear-gradient(red, blue);
}

如果有人能用外行的术语澄清如何使用指南针，将不胜感激。我是一个菜鸟，但是一旦掌握了它，对我来说继续学习RWD应该会容易得多。