절대 경로와 상대 경로

출처: 패스트 캠퍼스

 

상대 경로(./ ../) 절대 경로(http /)

1. xxx.jpg 주변에서 찾는다
index.html 파일 기준, 우선 주변 assets 폴더에 들어가야 함 

브라우저 입장에선 <img src="./images/xxx.jpg">로 찾을 수 없음 

<img src="./assets/images/xxx.jpg">로 고쳐줘야 함

./는 생략 가능하므로 <img src="assets/images/xxx.jpg">

 

2. 배경 이미지 삽입

main.css 기준 jpg 파일 찾기  / css 폴더 안에 들어있는 상태

jpg 파일은 assets 폴더에 있기 때문에 폴더 밖으로 나가서 (../) assets에 들어감 

background: url("../assets/images/xxx.jpg");