[HTML] 경로표기법(절대경로, 상대경로)
- 웹 개발/HTML
- 2019. 3. 31. 13:01
웹에서 경로표기법
: 현재 페이지 -> 다른 페이지(리소스)
'\' : 파일경로 (file:\\\)
자바경로
C:\Class\DB\JDBC
'/' : 웹 경로 구분자. 웹(http://)
현재
./WebContent/Example
1. 상대경로
기준 : 현재 웹페이지의 소속 폴더가 기준점
. : 현재 웹페이지가 소속된 폴더
.. : 현재 웹페이지의 부모 폴더
자식폴더명 : 현재 소속된 폴더의 자식 폴더
현재 위치를 '나'로 기준을 삼고 상대를 찾는 표현
2. 절대경로
기준 : 누구나 다 알고있는 동일한 위치를 기준으로 상대를 찾는 표현
'/' 기준 -> '/' 는 웹사이트의 루트 폴더 > "http://localhost:8090"
'/WebClientTest' == 'WebContent'
3. 로컬경로
사용 안함
웹서버가 아니라 브라우저가 동작 중인 로컬 컴퓨터의 경로를 탐색
4. 외부경로
http:// 시작
남의 사이트 주소
WebContent 폴더
: 외부에서(클라이언트) 브라우저로 접근할 수 있는 가장 상위 폴더
: 웹 루트 폴더
웹 서버
- C:\ > Class > WebClientTest > WebContent > ex01.htm
외부 시각
- http://localhost:8090/WebClientTest/Member/list.htm
- http://localhost:8090 -> 특정 컴퓨터 아파치 톰캣(웹 서버)
- WebClientTest -> 프로젝트명 -> 컨텍스트 루트(Context Root)
- http://localhost:8090/WebClientTest/ -> WebContent
http://localhost:8090/
http://localhost:8090/WebClientTest
http://localhost:8090/WebClientTest/ex01.htm
4가지 경로 표기법 예제
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h1>상대 경로</h1> <div><a href ="./ex04.htm">같은 폴더의 다른 페이지 이동하기</a></div> <div><a href ="ex04.htm">같은 폴더의 다른 페이지 이동하기</a></div> <div><a href ="./Member/list.htm">자식 폴더의 다른 페이지 이동하기</a></div> <div><a href ="Member/list.htm">자식 폴더의 다른 페이지 이동하기</a></div> <div><a href ="./Member/private/private.htm">자식 폴더의 다른 페이지 이동하기</a></div> <div><a href ="Member/private/private.htm">자식 폴더의 다른 페이지 이동하기</a></div> <div><a href ="../필기.txt">프로젝트 루트 폴더의 자원으로 이동</a></div> <h1>절대 경로</h1> <div><a href ="/WebClientTest/ex01.htm">절대경로</a></div> <div><a href ="/WebClientTest/Member/list.htm">절대경로</a></div> <div><a href ="/WebClientTest/Member/private/private.htm">절대경로</a></div> <div><a href ="/WebClientTest/Member/list.htm">부모폴더의 다른 페이지 이동하기</a></div> <h1>로컬 경로</h1> <div><a href ="ex01.htm">1번예제 (상대)</a></div> <div><a href ="/WebClientTest/ex01.htm">1번예제 (절대)</a></div> <div><a href ="C:\Users\user\Desktop\Class\WebClient\WebClientTest\WebContent\ex01.htm">1번예제 (로컬)</a></div> <h1>외부 경로</h1> <div><a href = "http://naver.com">네이버 이동하기</a></div> <div><a href = "http://www.naver.com">네이버 이동하기</a></div> </body> </html> | cs |
'웹 개발 > HTML' 카테고리의 다른 글
| [HTML] 테이블 태그, <table>, <tr>, <td> (1) | 2019.04.03 |
|---|---|
| [HTML] 이미지 태그, <img> 태그 (1) | 2019.04.03 |
| [HTML] 인라인태그와 블럭태그(div, span, ...) 종류, 비교 (5) | 2019.03.30 |
| [HTML] a태그이동, javascript:void(0)? (0) | 2019.03.29 |
| [HTML] 목록 태그 (ol, ul, dl, li) (0) | 2019.03.27 |