What is Sass?

• Sass - Syntactically Awesome Stylesheet
• Sass - CSS의 확장이다.
• Sass - CSS pre-processor이다.
• Sass - 모든 버전의 CSS와 호환된다.
• Sass - 단순 CSS작업을 효과적으로 도와준다.
• Sass - Hampton Catlin, Natalie Weizenbaum에 의해 2006에 발표됨
• Sass - 공짜이고 무료 사용가능하다.

/* define variables for the primary colors */
$primary_1: #a2b9bc;
$primary_2: #b2ad7f;
$primary_3: #878f99;

/* use the variables */
.main-header {
  background-color: $primary_1;
}

.menu-left {
  background-color: $primary_2;
}

.menu-right {
  background-color: $primary_3;
}

Sass File Type

모든 sass파일은 ".scss" 확장자를 사용한다.

Sass Comments

/* define primary colors */
$primary_1: #a2b9bc;
$primary_2: #b2ad7f;

/* use the variables */
.main-header {
  background-color: $primary_1; // here you can put an inline comment
}