20210522 SCSS, Sass 02 : mixin(@mixin, @include), 반복문(@for), 함수(@function), 색상 내장함수, 다른파일 참조하기(@import), 데이터 종류, @each, @content
SCSS 02 Sass(SCSS) 완전 정복! by HEROPY blog SCSS 공식 사이트 mixin JS의 함수처럼 코드를 재활용 하고자 하는 경우, 변수와 다르게 여러개의 코드들을 @mixin 이름을 통해서 선언하고, @include 이름을 통해서 사용 가능함 또한 함수처럼 매개변수를 지정하여 인수도 넣을 수 있음 인수와 매개변수는 순서가 있음 (정확한 위치에 넣어야 정상적으로 인식함) 매개변수의 기본 값을 넣어주는 경우 매개변수명: 기본값으로 선언부에서 매개변수를 만들어 주면 기본값을 사용할 수 있음 기본값을 넣어주고 건너 띄어 순서를 맞추기 위해서는 키워드 인수 를 사용해야함 매개변수명: 값 을 인자로 넣으면 해당 매개변수로 정확하게 인수가 들어감 (순서 상관 없이) 주의) 함수 개념은 따로 ..
20210521 SCSS, Sass 01 : SCSS vs Sass, 주석, 중첩(자손선택자), 자식선택자, 상위선택자 참조, 충첩 속성, 변수, 산술연산
SCSS 01 Sass(SCSS) 완전 정복! by HEROPY blog SCSS 공식 사이트 CSS style 전처리 패키지로서 CSS에서 개발상 불편함을 해소시키고자 여러 기능들을 제공하는 패키지 SCSS vs Sass SCSS 와 Sass 형태의 두가지 문법이 존재함, SCSS는 기존의 CSS와 호환이 잘 되고 비슷함 둘의 문법 차이는 SCSS는 세미콜론, 중괄호를 사용하고 Sass는 인덴트로 범위를 인지하기 때문에 깔끔해 보이긴 하다. Sass의 문제점을 보완하기 위해서 만든 문법이 SCSS라서 SCSS의 문법을 익히는게 좋다. (기능은 똑같다.) 둘의 엄청큰 차이점은, Mixins에서 나타남 표기 SCSS Sass 범위 {} 인덴트 명령종료 ; 없음 mixin @mixin = include @i..
