Препроцессоры CodePen CSS

Question

В CodePen CSS может иметь ряд препроцессоров, предлагаемых CodePen. Я хочу закодировать CSS в файле .scss, используя Sass.

Однако, на CodePen, они предлагают SCSS и Sass в качестве двух отдельных препроцессоров - какой я должен выбрать?

ТНХ!

Answer 1

Новый главный синтаксис (по состоянию на Sass 3) известен как «SCSS» (для «Хамх CSS»), и является подмножеством синтаксиса CSS3 в. Это означает, что все допустимые таблицы стилей CSS3 действительны и для SCSS. Файлы SCSS используют расширение .scss. Второй, более старый синтаксис известен как синтаксис с отступом (или просто «Sass»).

Sass и SCSS различаются в синтаксисе, однако, вы можете использовать оба .scss и .sass расширения взаимозаменяемы как процессы SCSS будет автоматически знать разницу, но тот не случай на codepen, необходимо указать точный синтаксис, вы сможете написать в

Sass синтаксис:.

// Variable 
!primary-color= hotpink 

// Mixin 
=border-radius(!radius) 
    -webkit-border-radius= !radius 
    -moz-border-radius= !radius 
    border-radius= !radius 

.my-element 
    color= !primary-color 
    width= 100% 
    overflow= hidden 

.my-other-element 
    +border-radius(5px) 

SCSS синтаксис

// Variable 
$primary-color: hotpink; 

// Mixin 
@mixin border-radius($radius) { 
    -webkit-border-radius: $radius; 
    -moz-border-radius: $radius; 
    border-radius: $radius; 
} 

.my-element { 
    color: $primary-color; 
    width: 100%; 
    overflow: hidden; 
} 

.my-other-element { 
    @include border-radius(5px); 
} 

читайте здесь, чтобы посмотреть, какой синтаксис лучше: http://thesassway.com/editorial/sass-vs-scss-which-syntax-is-better