상대 경로 vs 절대 경로

일상 코딩·2022년 3월 24일
0

HTML/CSS/JS

목록 보기
8/31

01.상대 경로

  • 파일 시스템에서 현재 작업 디렉터리부터 찾아갈 파일에 이르는 모든 디렉터리 목록으로 표시된 경로를 의미 합니다.

  • ./ - 나의 주변 폴더에서 찾음
  • ../ - 나의 상위 폴더로 이동해서 찾음

현재 나의 위치 - index.html
내가 찾고자 하는 파일 - ceo.jpg
알맞은 상대 경로 - <img src="./img/ceo.jpg">

현재 나의 위치 - left_menu.html
내가 찾고자 하는 파일 - logo.jpg
알맞은 상대 경로 - <img src="../../img/logo.jpg">
최상위 폴더로 바로 이동해서 찾는 상대경로 - <img src="/img/logo.jpg">

  • 상대 경로는 내가 작성중인 파일의 위치에 따라 주소가 상대적으로 달라진다.

02.절대 경로

  • 파일의 탐색 경로가 파일 시스템의 루트로부터 시작해 명시된 파일의 경로 이름을 의미 합니다.

  • http (https) - 주소 값이 고정적으로 지정 되어 있음
  • / (//) - 최상위 루트 경로를 의미

현재 나의 위치 - sub01.html
내가 찾고자 하는 파일 - ceo.jpg
알맞은 절대 경로 - <img src = "http//127.0.0.1:5500/sub/img/ceo.jpg">

현재 나의 위치 - left_menu.html
내가 찾고자 하는 파일 - ceo.jpg
알맞은 절대 경로 - <img src = "http//127.0.0.1:5500/sub/img/ceo.jpg">

  • 절대주소는 내가 작성중인 파일이 어디 있던 간에 주소가 절대로 변허지 않는다.
  • 경로 지정 방법은 이미지 태그 <img src="">뿐만 아니라 하이퍼링크 태그 <a href="">도 동일하게 적용 된다.
profile
일취월장(日就月將) - 「날마다 달마다 성장하고 발전한다.」

0개의 댓글

관련 채용 정보