이전 게시물에서 SSCS 규칙에 대해 논의했습니다. 우리는 변수로 시작하여 속성 이름에 대한 자리 표시자로 사용할 수 없는 방법을 보여 주면서 보간법이 그 자리에 사용되었으므로 보간에 대한 주제를 확장해 보겠습니다.

보간

sass docs는 말했다

Interpolation can be used almost anywhere in a Sass stylesheet to embed the result of a SassScript expression into a chunk of CSS.

#{expression} 를 사용하여 간단한 SASS 또는 CSS 코드에 sass 표현식을 삽입할 수 있습니다.

보간 구문:

#{expression}

예시:



속성 이름과 값 모두에 대한 자리 표시자로 보간을 사용할 수 있음을 명심하십시오.

선택자에 대한 자리 표시자로 활용할 수도 있습니다.
예시:

중첩 규칙

CSS 선택자는 HTML에서처럼 Sass에 중첩될 수 있습니다.

이 Sass 탐색 코드 예제를 살펴보십시오.



Sass에서 ul , li 및 선택자는 nav 선택자 안에 중첩되어 있습니다.

CSS에서는 규칙이 하나씩 정의됩니다(중첩되지 않음).

sass는 속성 중첩을 허용하기 때문에 기존 CSS보다 더 읽기 쉽고 깔끔하다는 것을 알 수 있습니다.

Sass 중첩 속성

text-align, text-transform 및 text-overflow와 같은 수많은 CSS 속성은 모두 동일한 접두사로 시작합니다.

Sass를 사용하면 중첩된 속성으로 작성할 수 있습니다.


지금은 그게 전부입니다. 중첩에 대해서는 다음 포스트에서 자세히 다루도록 하겠습니다.

만나요🧡