이미지 요소의 크기는 width, height로 알 수 있다. width, height는 이미지가 실제로 로드되지 않아도 스타일로 크기가 지정되어 있으면 그 크기를 반환한다. display: none을 지정했을 때 같이 화면에 랜더되지 않으면 크기를 가져올 수 없지만 재미있는 것은 랜더가 안된 상태에서 이미지 로드가 끝나면 이미지의 원본 크기를 반환한다는 점이다.

이미지가 실제로 차지하고 있는 크기는 offsetWidth, offsetHeight로 알 수 있다. display: none으로 화면에 랜더되지 않을 때에는 이미지 로드가 끝난 후에도 0을 반환한다.

화면에 랜더된 크기와 관계없이 이미지의 실제 크기를 알고 싶으면 naturalWidth, naturalHeight를 사용한다. 이미지를 다 로드 하지 않아도 크기를 알 수 있을 정도로 약간만 로드가 되면 값을 반환한다. 화면에 랜더되지 않아도 크기를 반환한다. 이미지의 가로세로 비율을 알고 싶을 때 유용하게 사용할 수 있다. IE9부터 지원한다.