[ React ] Styled-components 가상선택자

일반적인 CSS 가상선택자

.test{
  background:blue
}

.test:hover{
  background:red
}

<!-- 요소에 마우스를 가져다 댈 때 요소의 배경 색깔이 red로 변경 -->

styled-components 가성선택자

const test = styled.div`
 background:blue;
 &:hover{
   background:red;
 }
`;
// 요소에 마우스를 가져다 댈 때 요소의 배경 색깔이 red로 변경