Bitte Erklären SCSS Variablen

Question

Kann jemand über SCSS und Grundlagen erläutern, wie Variablen verwenden, Betreiber, Mixins und partials?

Answer 1

$color: red; // variable 

%button-default { // placeholder (doesn't generate css) 
    color: $color; 
} 

@mixin button() { // mixin 
    @extend %button-default; // get placeholder styles 

    @content; 
} 

button { 
    @include button() { // call mixin and pass content to it 
     font-size: 16px; 
    } 
} 

a { 
    @include button(); // just call mixin 
} 

Demo

Um SCSS Verwendung schluck, grunzen, webpack usw.