[코딩 공부_20] CSS, 절대단위와 상대단위

CSS의 크기 단위는 절대단위와 상대단위로 구분된다.

 

①  절대단위  : in, cm, mm, pt, pc가 있며 출력장치(모니터)의 물리적 속성을 아는 경우 효율적이다

 

②  상대단위  : em, ex, px, %가 있으며 기종간, 플랫폼 간의 호환성을 유지하는 데 유리하다

 

단위	내용	성질
px	화면 pixel 개수의 단위 * 해상도에 따라 화면에 보이는 실제 크기가 다를 수 있다	상대 크기
em	(부모 요소에서) 기존에 사용된 font 킄기에 비해 얼마의 비율의 크기로 결정 (1.0em = 100%) (ex : 1px*1em)	상대 크기
%	부모 요소의 컨테이너 크기에 비해 차지함	상대 크기
pt	포인트 단위로 1포인트는 1/72인치 기준으로 인쇄시에도 비슷한 크기로 인쇄됨	절대 크기
rem	(r=root) html 최상위 요소의 배수로 결정(ex : chrome 16px*rem)	상대 크기

* 대부분의 브라우저 폰트 기본 사이즈 : 12pt / 16px / 1em / 100%

* width / height 단위 : % / px