Использование COMPASS для адаптивного дизайна сайта - PullRequest
Новая
       39

Использование COMPASS для адаптивного дизайна сайта

0 голосов
/ 17 декабря 2018

Я пытаюсь освоить адаптивный дизайн веб-сайтов и уже понял концепцию Sass, скомпилировав .scss file в .css файл.Сейчас я пытаюсь научиться использовать compass.

Я уже установил Ruby и Compass.Я создал новый compass project в своей папке.

Using Compass

Inside the sassproject folder

Так что теперькогда я пытаюсь скомпилировать 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, но я бы хотел улучшить свою игру с Responsive Website Design.Поэтому я взял эту книгу, чтобы научить себя.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.

...