HTML의 상대 경로와 절대 경로의 차이점

小云云
풀어 주다: 2018-05-18 14:20:20
원래의
7755명이 탐색했습니다.

실제 웹 개발 시 CSS 파일 등을 포함한 이미지 삽입에는 모두 경로가 필요합니다. 파일 경로를 잘못 추가하면 참조가 무효화됩니다(링크된 파일을 열람할 수 없거나 삽입된 이미지를 표시할 수 없는 등). ). 초보자분들이 많이 헷갈려하시는데요, 아래에서는 상대경로와 절대경로에 대해 자세히 소개하겠습니다.

HTML 상대 경로

는 이 파일이 위치한 경로로 인해 발생하는 다른 파일(또는 폴더)과의 경로 관계를 말합니다.

예:

파일 1.htm의 절대 경로: d:/www/html/1.htm

파일 2.htm의 절대 경로: d:/www/html/2.htm

그러면: 2.htm에 대한 1.htm의 상대 경로는 다음과 같습니다: 1.htm

상대 링크 사용 방법:

같은 디렉토리에 링크하는 경우 링크할 문서의 이름만 입력하면 됩니다. , 예:

<a href =”1 htm”>网页链接 </a>
<img src=”bg.jpg” />
로그인 후 복사

에 연결하는 경우 다음 수준 디렉터리의 경우 디렉터리 이름을 먼저 입력한 다음 "/"를 추가하고 파일 이름을 입력해야 합니다. 예:

<a href =”html/ next.htm”>
<img src=”images/bg.jpg” />
로그인 후 복사

에 연결하는 경우 상위 디렉터리의 경우 먼저 "../"를 입력한 다음 디렉터리 이름, 파일 이름을 입력해야 합니다. 예:

<a href = “../ www/index.htm”>
로그인 후 복사

예제 요약

이제 aaa.html bbb인 4개의 html 파일이 있습니다. .html ccc.html index.html

  • aaa.html 경로는 D:/www/ adminwang/html/aaa.html

  • bbb.html 경로는 D:/www/adminwang / bbb.html

  • ccc.html 경로는 D:/www/ ccc.html

  • index.html 경로는 D:/www/ index.html

링크 파일은 다음 위치에 있습니다. 같은 디렉터리

예를 들어 ccc.html 파일 링크 index.html의 코드는 다음과 같습니다.

1

색인 링크 웹페이지


이전 디렉토리에 있는 파일을 링크하세요

예를 들어 bbb.html에서 ccc.html을 링크하는 코드는 다음과 같습니다:

1

ccc 웹페이지 링크


상위 2단계 디렉터리에 파일 연결

예를 들어 aaa.html이 ccc.html에 연결되는 코드는 다음과 같습니다.

1

ccc 웹페이지 링크


하위 디렉터리의 파일 링크

예를 들어 ccc.html이 bbb에 링크되는 코드입니다. html은 다음과 같습니다.

1

bbb 웹페이지 링크


링크 파일 2레벨 디렉터리

예를 들어 aaa.html을 링크하는 ccc.html의 코드는 다음과 같습니다.

1

HTML绝对路径

为文件提供的完全路径,包括适用的协议或盘符。也就是你的主页上的文件或目录在硬盘上真正的完整的路径。例如:

http://www.adminwang.com/index.htm
d:/ www /html/images/bg.jpg
로그인 후 복사

绝对路径没有什么好说的,相对路径掌握了,绝对路径就很简单了。

相关推荐:
HTMLa标签的href属性指定相对路径与绝对路径使用方法

html的绝对路径和相对路径怎么使用

php算法实现相对路径的案例

위 내용은 HTML의 상대 경로와 절대 경로의 차이점의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!