1. 절대적인 단위
1-1. 픽셀 (px)
화면을 표시하는 기준이 되는 가장 작은 정사각형
예를 들어 10px = 정사각형 10개의 길이
1-2. PPI (Pixel Per Inch)
모니터에서 1인치 정사각형 안에 픽셀이 얼마나 들어가는지
촘촘할수록 모니터 세밀한 표현
1-3. 해상도
화면에 가로로 몇 px, 세로로 몇 px
ex) 1280 X 720
2. 상대적인 단위
2-1. 퍼센트
부모 태그에 대해서 상대적인 크기
크기를 바꾸고 싶을 때 부모의 크기만 바꾸면 됨
2-2. em, rem
em : 인쇄에서 전통적으로 대문자 M의 크기로, CSS에서 1em = 부모태그의 font-size
rem : 1rem = 최상위 태그<html> 의 font-size
글자크기에 맞춰서 여백을 줄 수 있음.
'HTML, CSS' 카테고리의 다른 글
[CSS] 불투명도: opacity (0) | 2023.04.14 |
---|---|
[CSS] 그림자: box-shadow (0) | 2023.04.14 |
[CSS] 그라디언트: linear-gradient (0) | 2023.04.14 |
[CSS] 배경이미지: background-image (0) | 2023.04.14 |
[CSS] 색상 단위 (0) | 2023.04.14 |