20220320 TIL

https://www.youtube.com/watch?v=_a5j7KoflTs

유튜브로 SASS 공부중..

16:47초 까지

Sass에서는 변수를 선언할수 있고

변수는 $로 선언한다

nesting도 편하게 할수있다.

primary-color: #272727;accenc-color: #ff652f;
$text-color: #fff;

map기능까지 구현할수 있는데

$font-weights: (
"regular": 400,
"medium": 500,
"bold": 700,
);

body {
background: $primary-color;

color: $text-color;
}

.main {
width: 80%;
margin: 0 auto;
// nesting
#{&}__paragraph {
font-weight: map-get($font-weights, bold);
이것이 map기능을 이용한 것이다.

&:hover {
  color: pink;
}

}
}

sass파일을 저장하면 자동적으로 css파일을 컴파일해서

사용자에게 보여준다.