- CSS Extension Language

 

* Stylus
http://stylus-lang.com/
https://github.com/stylus/stylus - 9,992
- v0.54.5 , 2016/04


https://trends.google.com/trends/explore?cat=31&date=all&q=Sass,LESS,stylus,SCSS


* 컴파일 된 내용 보기
http://stylus-lang.com/try.html


stylus-lang.com/try/stylus.min.js
stylus(src).render()


//===========
LESS
https://github.com/less/less.js - 16,079
- v3.9.0 , 2018/11
 The dynamic stylesheet language
  - 컴파일 하지 않고 바로 확인 가능


//========================================
Sass (Syntactically Awesome Style Sheets)
https://github.com/sass/sass - 12,020
proposal.module-system.draft-6 , 2019/06


SCSS (Sassy CSS) : Sass의 버전 3에 등장한 문법
CSS 문법과 호환


//=====================================
Sass와 SCSS는 차이점
https://heropy.blog/2018/01/31/sass/
Sass(Syntactically Awesome Style Sheets)의 3버전에서 새롭게 등장한 SCSS는 CSS 구문과 완전히 호환되도록 새로운 구문을 도입해 만든 Sass의 모든 기능을 지원하는 CSS의 상위집합(Superset) 입니다.
즉, SCSS는 CSS와 거의 같은 문법으로 Sass 기능을 지원한다는 말입니다.

더 쉽고 간단한 차이는 {}(중괄호)와 ;(세미콜론)의 유무입니다.

'Code > Web' 카테고리의 다른 글

webpack에서 자바스크립트 소스코드 난독화  (0) 2019.07.27
Material Design for Bootstrap  (0) 2019.07.23
[CSS] CSS 확장언어, Sass(SCSS), LESS, Stylus  (0) 2019.07.23
[Web] CSS3  (0) 2019.07.23
웹사이트 속도 분석  (0) 2019.07.23
Amazon API Gateway vs Pusher 서비스 비교  (0) 2019.07.23
Posted by 코덴스

댓글을 달아 주세요