[HTML] 파일 경로 작성하는법(절대경로와 상대경로)

1. 절대 경로

• 고유한 경로
• 물리적 경로
  • 드라이브: C:\yesung\HTML\Day1\cat1.png(웹사이트 개발 시 사용하지 않음)
  • URL 주소: https://t1.daumcdn.net/daumtop_chanel/op/20200723055344399.png
• 보통 홈페이지 제작시 자신의 컴퓨터에서 HTML 문서를 만들고 이를 FTP를 통해서 웹서버에 일괄적으로 올리기 때문에 절대경로로 이미지를 삽입했다면 모두 고쳐줘야 하는 불편이 있음
• 일반적으로 절대경로보다는 상대경로를 이용해서 이미지를 삽입하는게 좋음

 

2. 상대 경로

 

• 이미지를 삽입할 HTML 문서를 기준으로 경로를 인식하는 방법
• 이미지가 HTML문서와 같은 디렉토리에 있는 경우
      <img src='파일명'>, <img src='./파일명'>
•  이미지가 하위 디렉토리에 있는 경우
      <img src='디렉토리명/파일명'>, <img src='./디렉토리명/파일명>
•  이미지가 상위 디렉토리에 있는 경우
      <img src='../파일명'>, <img src='./../파일명'>
•  이미지가 상위 디렉토리의 하위 디렉토리에 있는 경우(다른 디렉토리에 있는 경우)
      <img src='../하위디렉토리명/파일명'>, <img src = './../하위디렉토리명/파일명'>