1. 인라인: 특별한 이유가 없는 한 인라인으로 작성하지는 않는다고..

<div style={{
  color: 'purple', 
  fontSize: '20px', 
  opcacity: 0.8
}}>
  yay!
</div>

2. 기존의 css파일 사용하기 (index.css, App.css 같은 것)
   • create-react-app으로 프로젝트 작성하면 생성되는 index.css, App.css 파일에 작성할 수 있는데 이 경우 클래스 이름이 중복되어 내가 의도하지 않았던 곳에도 스타일이 적용될 수 있다.

3. .module.css
   • 컴포넌트이름.module.css 으로 파일 이름을 작성한다.
   • 컴포넌트 파일에 이 css 파일을 import한다

     import styles from "./Box.module.css"

   • 그리고 아래와 같이 적용한다.

     <div className={styles.css파일의선택자}></div>

4. css in js

• styed-components를 import해서 사용한다.

import styled from 'styled-components'

const Box = styled.div`
  background-color: salmon;
  padding: 10px;
`
<Box>hello</Box>