SSAS

/
원래 CSS에서는 이렇게 생긴 주석을 사용한다.
'여러 줄 짜리 주석'이라 부으기도 하는...
/

//Sass에서는 이렇게 생긴 '한 줄 짜리 주석'을 사용할 수 있다.
//한 줄 짜리 주석이라서
//새로 한줄을 쓸 때마다 '//' 기호를 써주어야 한다.

기존css 주석은 컴파일이 되지만 sass주석은 컴파일이 되지 않는다.

중첩규칙

div {
width: 100px;
height: 100px;
}
div p {
color:red;
}
div p span {
color: blue;
}

css에서는 스타일을 정의하기 위해 선택자를 서로 다른 선언문에서 반복해서 써야 하는 경우가 있다.

스타일 시트가 커지면 커질수록 자주발생해서 이러한 에러 상황을 보안하고자 sass가 만들어 졌다.
-필연적으로 복잡해짐
-관련선언문 수정시 모든 선언문 고쳐야 하는 상황

그래서 sass팀은 개발시에 중첩(nesting)만듬
그리고 컴파일 후 결과 파일에는 선택자기 각자 따로 생성되어 반영된다.

div {
     width: 100px;
     height: 100pc;
   p {
      color: red;
      span{
           color:blue;
      }
    }
  } 

이렇게 깔쌈하게 만들어 진다.![](https://velog.velcdn.com/images/9oodvibe5only/post/bdd5a91a-f9e3-4a29-a700-0832ef88c02e/image.png)