html

HTML 탐구생활 : 이미지 삽입 요소 img 태그

환상곰 2022. 6. 12. 00:13
반응형

 

1. img태그란?

img태그는 문서에 이미지를 삽입할 때 사용한다.

 

 

2. img태그 사용방법

<img src="이미지 주소" alt="이미지 설명">

img 속성값은 대표적으로 src와 alt가 있다. src 속성은 필수이며 이미지의 절대경로 또는 상대경로를 적어준다. alt의 경우 이미지를 제대로 불러오지 못했을 경우의 대체 텍스트이며 이미지를 설명하는 내용을 적어준다. 

 

-- 절대경로와 상대경로 

절대경로 : 절대적인 위치를 가리키는 경로, 컴퓨터의 디렉토리에서는 C:\ 를 포함, URL에서는 http:// 를 포함

상대경로 : 작업 디렉토리를 기준으로 상대적인 위치를 가리키는 경로

 

절대경로의 경우 보통 외부 이미지 파일을 가져올 때 사용하고 상대경로는 내부 이미지 파일을 가져올 때 사용한다.

상대경로를 사용할 때 이미지를 삽입할 문서를 기준으로 이미지가 상위폴더에 있는지 하위폴더에 있는지 확인하고 작성해주어야 한다.  

 

 

3. 이미지 파일의 확장자

src값을 입력할 때 이미지 파일의 확장자는 꼭 들어가야 한다. 확장자는 매우 다양한데 대표적으로 .jpg나 .png, .gif등이 있다. 그리고 브라우저별로 지원하는 확장자가 다르니 확인하는 것이 좋다. 

 

반응형