절대길이 단위 : px
- 가장 많이 사용하는 단위 - 절대길이단위 : px(픽셀)
- px은 어떤 상황에서도 동일한 값을 유지하므로, 가변성이 없음. 즉, 반응형 웹에는 적합하지 않음
em과 rem
- em과 rem은 박스에서 텍스트 크기를 조정할 때 사용하는 상대단위임.
- em은 부모 요소의 글꼴 크기를, rem은 루트 요소의 글꼴 크기를 의미함.
- em 으로 내부(padding), 외부(margin) 여백 크기를 정할 때는 자기 자신의 글자 크기를 기준으로 한다.
- 주변 상황에 따라 그 크기를 달리할 수 있는 가변성을 지니고 있지만, 브라우저나 기기 화면의 크기에 따라 크기가 달라지는 단위는 아님.
따라서 진정한 반응형 단위로 볼 수 없음.
화면 크기에 맞추어 반응하는 단위들 - 가변단위
- font-size : 1vw; - 뷰포트 너비의 100분의 1
- font-size : 1vh; - 뷰포트 높이의 100분의 1
- font-size : 1vmin; - 뷰포트 높이와 너비 중 작은 쪽의 100분의 1
- font-size : 1vmax; - 뷰포트 높이와 너비 중 큰 쪽의 100분의 1
형그니
형그니
형그니
형그니