프론트엔드-코드/SCSS

&

sdafdq 2023. 6. 30. 16:40
div {
  width: 600px; height: 200px;
  border: 1px solid #808080;
  h3 {
    font-size: 32px; color: #ffa500;
    &+p{
      color: #333; font-size: 20px;
    }
  }
}
 
&란 자기 자신을 뜻함.
h3 내에서 &를 썼으니 h3이 &
div {
  width: 600px;
  height: 200px;
  border: 1px solid #808080;
}
div h3 {
  font-size: 32px;
  color: #ffa500;
}
div h3 + p {
  color: #333;
  font-size: 20px;
}

 

css로 빌드 된 파일임.

 

&가 자기 자신보다 부모. 라는게 더 정확함.

 

.container &{
  h1{
    color:$color;
  }
}

이건 .container의 부모. 임

'프론트엔드-코드 > SCSS' 카테고리의 다른 글

변수  (0) 2023.09.11
네임스페이스로 정의  (0) 2023.09.11
주석  (0) 2023.09.11
변수  (0) 2023.09.01
문법  (0) 2023.09.01