공부기록용

Sass(SCSS)의 주석기본적으로 CSS의 주석와 동일한 /* */구문을 사용하며 추가로 한 줄을 위한 // 주석처리도 가능하다. 단 한 줄 주석은 .css로 컴파일되면 보이지 않는다..scss/*여러 줄을 동시에*/// 한 줄만 주석처리> 하지만 빌드된 css에서는 한 줄 주석을 처리되지 않으니 주의해야 함중첩 규칙(nesting)CSS에서는 스타일을 정의하기 위해서 선택자를 서로 다른 선언문에서 반복해서 작성해주어야 하는 경우가 많다. /* div의 반복 */div{ width: 100%;}div p{ color: red;}div p span{ color: blue;} Sass에서는 선택자를 서로 다른 선언문에서 계속 반복해서 작성하지 않고 서로 중첩하여 사용할 수 있다.>..

Sass 구문으로 작성된 코드는 Sass전처리기와 컴파일러의 도움을 받아야 CSS파일로 빌드(build)되어야 사용할 수 있다. PC에서 Sass를 CSS로 빌드할 수 있는 도구가 준비되어야 한다.1. VS code확장 기능 이용하기vs code의 확장 프로그램을 설치해서 사용하는 방법이다 html을 만들고 style 폴더를 생성후 .scss로 파일을 생성한다. scss에 스타일을 작성하고  하단에 위치한 Watch Sass를 눌러주면 CSS파일로 변환을 해준다. 그럼 작성한 SCSS를 CSS로 변환한 CSS 파일도 생성된다. 코드를 변경할때는 SCSS의 코드를 변경하면 CSS는 자동으로 build되어 반영되므로 수정시 SCSS를 수정하는 것이 좋다.기존 dart Sass와 Ruby Sass가 있었는데 ..