상대 경로
./ (생략 가능)
../ (현재 위치의 상위폴더로)
절대 경로
http (https)
/ (//) : 최상위 경로, 루트 경로
localhost : 우리의 컴퓨터 환경
./images/image.png 는 images/image.png 와 동일하다.
상위경로의 image폴더에서 가져오고 싶다면?
../images/image.png 로 찾을 수 있다.
http://localhost:5500 으로 프로젝트를 불러오면
루트경로는 프로젝트 폴더 안이 된다.
즉 절대 경로로 image.png를 가져오려면
/images/image.png 를 해야한다.
또 내 페이지가 웹상에서 https://~~ 라고 가정을 하자.
그러면 image.png는
https://~~/images/image.png 로 가져올 수 있다.
따가서 http, https 역시 절대경로이다.
div {
/* css는 C언어와 같이 세미콜론으로 줄 구분 */
width: 200px;
height: 200px;
background: url("../images/chicken.webp");
}css파일에서 상대경로를 이용해 이미지를 출력해보았다.
이미지는 가로 200, 세로 200픽셀로 잘려서 출력된다.
