미디어쿼리 Media query

웹과 앱을 동시 대응해야 하는 경우 반응형 화면을 만들기 위해서 미디어 쿼리를 이용한다.
CSS에서 어떤 스타일을 선택적으로 적용하고 싶을 때 사용하는 if 절이라고 생각하면 쉽다.

1. 미디어 쿼리 기본구조

@media (조건) {
  스타일
}

.
.

2. 최대 / 최소 너비 - max / min

@media (max-width: 768px) {
    .button {
      width: 100%;
    }
  }

아직 수식이 어색해서 나름대로 번역을 해봤다.
max-width: a > a보다 커지기 전까지는
min-width: a > a보다 작아지기 전까지는