2022-04-11
width, height
요소의 가로/세로 너비
기본값 auto 브라우저가 너비를 계산
단위 px, em, vw
max-width, max-height
요소가 커질 수 있는 최대 가로/세로 너비
기본값 none 최대 너비 제한 없음
단위 px, em, vw
max-width, max-height
요소가 작아질 수 수 있는 최소 가로/세로 너비
기본값 0 최소 너비 제한 없음
단위 px, em, vw
CSS 단위
px 픽셀
% 상대적 백분율
em 요소의 글꼴 크기
rem 루트 요소(html)의 글꼴 크기
vw 뷰포트 가로 너비의 백분율
vh 뷰포트 세로 너비의 백분율
단축 속성
margin
요소의 외부 여백(공간)을 지정하는 단축 속성, 값으로 음수 사용이 가능하다.
기본값 0 외부 여백 없음
auto 브라우저가 여백을 계산, 가로(세로) 너비가 있는 요소의 가운데 정렬에 활용함
단위 px, em, vw
margin의 단축 속성
margin: top, right, bottom, left
margin: top, bottom left, right
margin: top left, right bottom
margin: top right bottom left
padding
요소의 내부 여백(공간)을 지정하는 단축 속성, 내부 여백이 커질 수록 요소의 크기도 커짐
기본값 0 외부 여백 없음
단위 px, em, vw
% 부모 요소의 가로 너비에 대한 비율로 지정
margin의 단축 속성
padding: top, right, bottom, left
padding: top, bottom left, right
padding: top left, right bottom
padding: top right bottom left
