이미지는 웹 페이지의 디자인과 모양을 향상시킬 수 있습니다.
<img> 요소는 종료태그가 없습니다.
src 속성을 사용하여 이미지의 URL을 지정합니다.
alt 속성을 사용하여 사용자가 이미지를 볼수 없는 경우 대체 텍스트를 제공합니다.
alt 속성은 필수 속성입니다.
이미지의 너비 width 속성과 높이 height 속성으로 지정할 수 있습니다.
속성의 값은 항상 픽셀 단위로 정의합니다.
또는 style속성의 CSS속성으로 지정할 수 있습니다.
두값중 하나의 값만 있다면 다른 한쪽은 자동으로 조절됩니다.
이미지맵은 클릭 가능한 영역이 있는 이미지 입니다.
<map> 요소를 정의 하고 name속성으로 이름을 지정합니다.
<img> 요소의 usemap 속성으로 <map> 요소와 연결합니다.
<map> 요소내에 <area> 요소를 정의하여 클릭 가능한 영역을 지정합니다.
<picture> 요소는 서로다른 이미지 소스를 참조하는 여러 <source> 요소를 포함합니다.
이렇게 하면 브라우저는 현재 보기에 가장 적합한 이미지를 선택합니다.
<source> 요소의 srcset 속성에 이미지의 URL을 지정하고, media 속성에 창의 크기를 지정합니다.
항상 <img> 요소를 <picture>요소의 마지막 요소로 지정하십시오.
이렇게 하면 <picture>요소를 지원하지 않는 브라우저 또는 <source> 요소가 일치하지 않은 경우 사용됩니다.
<picture>요소가 지원되지 않거나 500px 이하이면 nature.jpg가 표시됩니다.
브라우저창의 너비가 700px 이상이면 kitty.jpg, 500px 이상이면 mallard.jpg 이미지가 표시됩니다.