[공지] SCSS (= SCSS + CSS) - CSS Preprocessor (전처리기)

※ 규모가 큰 CSS 프로젝트 작업하실 분만 배우세요. 

CSS Preprocessor 종류

 

SASS・SCSS (= SASS + CSS)

https://sass-lang.com/

	SASS	SCSS ★	CSS
{} 기호	사용 X	사용 O	사용 O
; 기호	사용 X	사용 O	사용 O
: 뒤 공백	필요 O	필요 X	필요 X
mixin 정의	= 기호	@mixin	존재 X
mixin 호출	+ 기호	@include	존재 X
확장자	sass	scss	css

 

※ SASS

1. {} 기호 사용 X. 
2. ; 기호 사용 X. 
3. : 뒤의 공백 필요 O.
4. mixin에 = + 사용.
5. sass 확장자 사용.

 

※ SCSS 

1. {} 기호 사용 O. 
2. ; 기호 사용 O. 
3. : 뒤의 공백 필요 X.
4. mixin에 @mixin, @include 사용.
5. scss 확장자 사용.

 

---

PS.

• LESS: http://lesscss.org/
• STYLUS: https://stylus-lang.com/

 

https://heropy.blog/2018/01/31/sass/