Sass 시작하기 — 스타일시트를 작성하는 멋진 방법

Sass는 'Syntactically Awesome StyleSheets'의 약자로 문법이 멋진 스타일시트라는 의미입니다. CSS라는 기본 언어에 힘과 우아함을 더한 Sass는 CSS의 확장 언어라 할 수 있습니다.1

CSS의 모든 문법과 함께 변수 variables, 중첩 규칙 nested rules, 믹스인 mixins, 인라인 불러오기 inline imports 등 다양한 기능을 지원합니다. Sass는 내용이 많은 스타일시트를 잘 정리하게 도와주며, (특히 컴퍼스 스타일 라이브러리(새창)2를 사용하면) 스타일시트를 빠르게 작성할 수 있게 해줍니다.


특징

  • CSS의 모든 문법을 지원하는 CSS 완전 호환성3
  • 변수, 중첩, 믹스인 등 사용으로 언어 확장
  • 색상 등 값을 처리하는 다수의 유용한 함수
  • 라이브러리를 위한 제어 지시문과 같은 고급 기능
  • 형식을 잘 갖춘 4가지 CSS 출력 스타일

Footnotes

  1. 원문(새창)

  2. 컴퍼스 Compass는 Sass를 사용하는 오픈소스 CSS 작성 프레임워크입니다.

  3. Sass의 두 가지 문법 중 SCSS로 작성해야 이 혜택을 누릴 수 있습니다. 자세한 내용은 여기에서 확인하세요.