max-witdth , max-height

max-width 

최대 너비이며 max-width보다 커지는 것을 방지합니다.

max-height

최대 높이이며 max-height보다 커지는 것을 방지합니다.

 

 예를 들어 이미지 크기를 정하지 않으면 부모의 요소를 벗어납니다.

 하지만  max-width 설정하면 부모요소의 크기로 맞쳐진다는 것입니다. 

img {
  max-width: 100%;
}

최대 크기를 부모 요소의 크기로 제한하는 것입니다. 가로 세로 비율에 맞게 크기가 줄어듭니다.

 

www.codingfactory.net/10830 참고해서 글을 썻습니다. 감사합니다.