본문 바로가기
IT/html

html img 태그

by 뉴코딩맨 2023. 2. 20.

HTML <img> 태그는 이미지를 삽입하는 데 사용되는 태그입니다. 다음과 같은 속성을 가질 수 있습니다.

  • src: 이미지 파일의 URL
  • alt: 이미지에 대한 대체 텍스트 (스크린 리더 사용자를 위해 사용)
  • width: 이미지의 너비 (픽셀 또는 비율로 지정)
  • height: 이미지의 높이 (픽셀 또는 비율로 지정)
  • title: 이미지의 내용을 설명 (마우스 오버 시 툴팁 형식으로 표시)

<img> 태그를 사용하여 웹 페이지에 이미지를 삽입하면 웹 페이지의 시각적 디자인을 개선하고 사용자 경험을 향상시킬 수 있습니다. 또한, 이미지에 대한 대체 텍스트를 제공함으로써 웹 접근성을 향상시킬 수 있습니다.

 

사용법1

 

예를 들어, 다음은 로컬 파일시스템의 image.jpg 파일을 페이지에 삽입하는 방법입니다.

 

<img src="image.jpg" alt="이미지 설명">

 

src 속성은 이미지 파일의 경로를 지정합니다. alt 속성은 이미지에 대한 대체 텍스트를 지정합니다. 이 속성은 시각 장애가 있는 사용자가 웹 페이지를 사용하는 경우 이미지에 대한 설명을 제공하기 위해 사용됩니다.

 

사용법2

 

<img src="image.jpg" alt="이미지 설명" width="500" height="300" title="이미지 제목">

 

이미지 크기를 지정하기 위해 width height 속성을 사용할 수 있습니다. 또한, title 속성을 사용하여 이미지에 마우스를 올리면 나타나는 툴팁을 지정할 수 있습니다.

'IT > html' 카테고리의 다른 글

html5란?  (0) 2023.02.20
html 주석  (0) 2023.02.20
html a 태그  (0) 2023.02.19
html 목록 태그  (0) 2023.02.18
HTML 이란?  (0) 2023.02.17

댓글