이미지 출력 / img, 경로(절대경로, 상대경로)

img 태그 : 이미지 파일을 제공받아 출력하기 위한 태그

• 웹에서 사용하는 이미지 파일 : GIF 파일, PNG 파일, JPEG 파일 등

 

• alt 속성 : 출력 이미지에 대한 설명을 속성값으로 설정 -- 음성 지원
• src 속성 : 이미지 파일을 경로(URL 주소)를 속성값으로 설정
  src 속성으로 설정된 이미지 파일이 없는 경우 404 상태코드 전달
• width 속성 : img 태그의 폭을 변경하여 출력될 이미지의 크기 변경 가능
  (이미지의 폭을 변경하면 높이는 자동 변경된다.) 

<img alt="코알라" src="http://localhost:8000/web/html/Koala.jpg" width="200">

 

 

 

웹문서와 동일한 서버에 존재하는 웹자원(WebContext)은 URL 주소에서 서버 접속 관련 정보를 생략하여 표현 가능하다.

    ⇒  프로토콜, 서버명, 포트번호 생략가능

 

* 절대경로 표현 방법 : 웹자원의 경로를 서버의 최상위 디렉토리(Root Directory)를 기준으로 표현

<img alt="코알라" src="/web/html/Koala.jpg" width="200">

 

* 상대경로 표현 방법 : 웹자원의 경로를 현재 요청한 웹문서의 경로를 기준으로 표현

<img alt="코알라" src="./Koala.jpg" width="200">