크기 단위
- px(픽셀)
- 모니터 해상도의 한 화소인 '픽셀' 기준
- 픽셀의 크기는 변하지 않기 때문에 고정적인 단위
- %
- 백분율 단위
- 가변적인 레이아웃에서 자주 사용
- em
- 부모 요소에 대한 상속의 영향을 받음
- 배수 단위, 요소에 지정된 사이즈에 상대적인 사이즈를 가짐
- rem
- 부모 요소에 대한 영향 X
- 최상위 요소(html)의 사이즈를 기준으로 배수 단위를 가짐
html 요소 크기의 기본값은 웹브라우저 설정에서 정한 크기인데 보통 16px이다.
em과 rem의 차이점 중요!
- viewport
- 디바이스의 viewport를 기준으로 상대적인 사이즈가 결정됨
색상 단위
- 색상 키워드
- 대소문자 구분 X
- red, blue, black과 같은 특정 색을 직접 글자로 나타냄
- RGB 색상
- 16직순 표기법 혹은 함수형 표기법을 사용해서 특정 색을 표현
#+ 16진수 표기법- rgb() 함수형 표기법
- HSL 색상
- 색상, 채도, 명도를 통해 특정 색을 표현하는 방식
passionate developer