개념정리/img

width와 max-width의 차이

pcy 2022. 8. 2. 09:57

width 속성은 속성값을 100%로 설정할 경우 요소의 크기를 100%로 유지하지만,

max-width 속성은 100%로 설정할 경우 요소의 기본 크기 이상으로는 크기가 조절되지 않는다.

width: 100%로 지정한 경우에는
: 창의 크기를 줄이거나 늘리면 창의 너비에 맞춰 크기가 충실히 증감한다.

가로 너비 값을 아무 것도 지정하지 않은 경우
: 창의 크기를 줄여도 이미지 크기에 아무런 변화도 없다.

max-width: 100% 로 지정한 경우
: 창의 크기를 줄이면 줄인만큼 충실히 줄어들지만,
크기를 키울 때는 원래 이미지 사이즈보다 커지지는 않는다.

출처: https://ccuram.tistory.com/29