SASS

[Sass] Sass 작성 규칙

Sass 작성 규칙을 익히려면 아무래도 따로 정리가 필요할 것 같아서 정리해보는 글 인코딩 windows 환경에서 컴파일할 때 오류가 발생할 수 있으므로 모든 scss 파일에 charset을 선언한다. 컴파일 후, charset 선언은 하나만 남게 되므로 여러 파일에서 작성해도 문제없다. @charset 선언 전에 공백에 없도록 주의한다. @charset "UTF-8" header { background-color: #000; } 중첩 최대 3뎁스 중첩까지 사용을 권장한다. (셀렉터의 갯수가 아닌 scss 코드 상의 중첩) 3뎁스가 넘어갈 경우 하위연결자나 별도의 모듈로 뽑아낸다. 미디어 쿼리의 중괄호는 중첩 수에 포함시키지 않는다. header { h1 { a {} } .gnb {} } 들여쓰기 중첩마..

[Sass] CSS 전처리기 Sass

CSS 전처리기란? CSS는 프로젝트 규모가 커지면 쉽게 지저분해지고 유지보수가 어려워지는 단점이 있다. CSS 전처리기는 이러한 CSS의 한계를 보완하기 위해 자신만의 특별한 문법을 갖고 CSS를 생성하는 프로그램이다. 메타언어로서 추가 기능과 도구를 제공하여 CSS 구문을 개선한다. 대표적인 전처리기로는 Sass, LESS, Stylus 등이 있다. Sass 그리고 SCSS Sass: Syntactically Awesome StyleSheet SCSS: Sassy SCC CSS 전처리기라고 하면 대표적으로 Sass에 대해서 들었을텐데 그 때 꼭 같이 듣게 되는 것이 SCSS이다. Sass는 들여쓰기 감지를 핵심 특성으로 갖는 표기법과 전처리기 두 가지를 의미한다. Sass는 코드를 작성할 때 중괄호를..