[css] 반응형 웹 단위

절대 단위

> 항상 고정된 길이를 나타내는 단위

• cm
• mm
• Q
• in
• pc
• pt
• px

상대단위

고정되지 않고 어떤 기준에 따라 유동적으로 바뀔 수 있는 길이를 나타내는 단위

• em : 현재 요소의 font-size에 비례한 크기 조절
• ex
• ch
• rem : 현재 페이지 html 태그에 설정된 font-size에 비례한 크기
• in
• vw : 뷰포트의 너비값에 맞게 사용할 수 있는 단위로, 현재 웹페이지를 보고 있는 프로그램의 너비에 기반
• vh : 뷰포트의 높이값에 기반한 크기 조절
• vmin
• vmax
• % : 백분율 단위의 상대 단위로 요소에 지정된 사이즈에 상대적인 사이즈를 설정

비교

px, %, rem, em, vw, wh

1rem == 16px

font-size : rem;

padding : em;

800% == 8rem;