HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <img> width 속성

width 속성은 픽셀 단위로 이미지의 너비를 지정합니다.

온라인 예제

높이와 너비 모두가 30 픽셀의 이미지：

예제

<!DOCTYPE　html>
<html>
<head>
<title>HTML: <img> width 속성　-　기본 튜토리얼 웹 oldtoolbag.com</title>
<body>
<img　src="haha.gif"　alt="haha　face"　width="30"　height="30>
</body>
</html>

테스트를 보세요 </›

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저가 width 속성을 지원합니다.

width 속성은 픽셀 단위로 이미지의 너비를 지정합니다.

푸터:항상 높이와 너비 속성을 동시에 지정합니다. 높이와 너비가 설정되면 페이지 로드 시 이미지가 필요한 공간을 유지합니다. 그러나 이러한 속성이 없으면 브라우저는 이미지의 크기를 알 수 없으며 적절한 공간을 유지할 수 없습니다. 결과적으로 페이지 레이아웃은 로드 중(이미지 로드 시) 변경됩니다.

푸터:height와 width 속성을 사용하여 대형 이미지의 크기를 줄이면 사용자가 대형 이미지를 다운로드하게 됩니다(자바스크립트에서 보이는 것보다 작게 보일 수 있습니다). 이러한 상황을 피하기 위해 페이지를 사용하기 전에 프로그램으로 이미지를 다시 조정해야 합니다.

HTML 4.01 와 HTML5사이의 차이

HTML 4.01 에서, 너비는 픽셀 단위로 또는 포함된 요소의 퍼센트로 정의되어야 합니다. HTML5 에서, 너비 값은 픽셀 단위로 지정해야 합니다.

문법

<img width="픽셀">

속성 값

값	설명
픽셀	픽셀 단위의 너비(예: width="100"）

　HTML <img> 태그

HTML: <template> 태그