채니의 개발일기

HTML - 절대경로 상대경로 본문

프론트엔트/HTML,CSS

HTML - 절대경로 상대경로

윤채니챈 2023. 7. 18. 20:02
728x90
반응형

상대경로

 

./" (현재 디렉토리): "./"은 현재 작업 중인 디렉토리를 나타냅니다.

이것은 일반적으로 현재 파일이 위치한 디렉토리를 의미합니다.

예를 들어, 현재 디렉토리에 있는 "image.jpg"라는 파일을 참조하려면 다음과 같이 사용할 수 있습니다:

<img src="./image.jpg" alt="이미지">

 

"../" (상위 디렉토리): "../"는 현재 디렉토리의 상위 디렉토리를 나타냅니다.

이것은 파일이나 폴더를 현재 디렉토리보다 한 단계 위의 디렉토리에서 찾을 때 사용됩니다.

예를 들어, 현재 디렉토리의 상위 디렉토리에 있는 "styles.css"라는 파일을 참조하려면 다음과 같이 사용할 수 있습니다:

<link rel="stylesheet" href="../styles.css">

 

 

 
 

절대경로

 

 

"/" (루트 디렉토리): "/"는 웹 서버의 루트 디렉토리를 나타냅니다.

(루트 경로는 파일 시스템이나 웹 서버에서 최상위 디렉토리 또는 최상위 URL을 나타냅니다.)

웹 사이트의 모든 파일과 폴더는 루트 디렉토리를 기준으로 경로가 지정됩니다.

예를 들어, "/" 경로는 웹 사이트의 홈 페이지를 의미합니다. 다음은 루트 디렉토리에 있는 "image.jpg" 파일을 참조하는 예시입니다:

<img src="/image.jpg" alt="이미지">

 

"http" (하이퍼텍스트 전송 프로토콜): "http"는 월드 와이드 웹에서 리소스에 접근하기 위한 프로토콜입니다. 

예를들어 vscode에서 5500번 포트를 이용한다고하면 localhost:5500 를 입력하여 vscode 웹페이지로 이동가능합니다.

 

 

 

728x90
반응형