7. 이미지(3-1)

1. 이미지 삽입하기 위한 태그 

이미지 관련 태그 

• 이미지 관련 태그 <img> 

– 웹 페이지에 이미지를 삽입하는 방법과 출력하기 위한 태그 

– <img src=“이미지 파일명”> 

• 이미지 파일인 GIF, JPEG 파일은 웹 브라우저에서 바로 인식 

• “src” 속성에 경로를 지정 

• <img> 

– 웹 페이지에 이미지를 삽입하는 방법과 출력하기 위한 태그 

– <img src=“이미지 파일명”> 

• 이미지 파일인 GIF, JPEG 파일은 웹 브라우저에서 바로 인식 

• “src” 속성에 경로를 지정

 

2. 상대경로와 절대경로 

[상대경로 절대경로] 

– src 속성에 지정되는 경로를 상대 경로와 절대 경로로 표시 

– 상대경로 

• 웹 페이지가 저장된 폴더(즉 같은 폴더)에 저장되어 있을 경우 파일명만 써준다. 

• EX. <img src=“sample.gif> 

– 절대경로 

• 루트 디렉토리부터 일일이 이미지 파일명까지 모두 기술한다. 

• EX. <img src=“C:\HTML\sample\sample.gif> 

3.이미지에 설명을 나타내기 위한 태그 

설명을 나타내기 위한 태그

– alt 속성은 이미지 파일의 설명을 나타낸다. 

– 마우스를 이미지에 가져가면 alt에 지정한 설명이 도움말 처럼 나타남 

• EX.<img alt=“이미지 설명”> 

이미지 테두리선 

– border 속성을 주어 이미지의 테두리선을 지정 

– 선의 두께 조절 가능, 두께는 픽셀 단위로 지정 

• Border 속성을 주기 전에는 테두리가 안 나타나지만 링크시키면 테두리가 나타난다. 

• Border=“0”으로 지정하여 테두리선을 없앨 수도 있다.