반응형 웹(responsive web)

반응형 웹이란? 어떤 화면에서 보든 그 디바이스 크기에 맞춰 화면이 반응하여 조절되는 웹을 의미한다.

반응형 웹에서 사용하는 폰트

1. px
   : 데스크탑이나 모바일, 노트북에서 동일한 폰트 크기를 사용한다.
2. em
   : 부모 크기의 배수로 적용한다.
3. rem
   : 브라우저의 기본 크기의 배수로 사용한다. (기본 크기: 16px)
4. vw
   : 브라우저의 가로 너비에 영향을 받는다. (1vw = 기본 화면 가로 넓이의 1/100, 1vw = 10px)
5. vh
   : 브라우저의 세로 너비에 영향을 받는다.

media query

: 반응형 웹을 만들기 위한 CSS

@media 미디어 유형 and 조건 and 조건

ex) 미디어 유형이 screen이고 최소 너비가 768, 최대 넓이가 1500일 경우

@media screen and 768px and 1500px

기기별 화면 크기 차이

1. 모바일
   : ~768px
2. 태블릿
   : 768px~1024px
   태블릿 가로는 992px의 길이를 가진다.
3. 데스크탑
   : 1024px~