1. <a>
<a> : anchor tag_하이퍼링크로 외부 주소로 연결해 주는 태그.
- 기본값 : 파란색 - 방문전
빨간색 - 활성링크(클릭하는 순간)
자주색 - 방문한 페이지
[기본구조]
<a href="경로">내용</a>
->이 경로의 기준은 항상 작성하고 있는 html문서 기준임을 명심하자.<예제>
4. main.html 문서의 mark-up
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>main</title>
</head>
<body>
<h1>main.html</h1>
</body>
<ul>
<li><a href="main.html">main</a></li>
<li><a href="a/sub1.html">sub1</a></li>
<li><a href="a/sub2.html">sub2</a></li>
<li><a href="a/b/sub3.html">sub3</a></li>
<!--
/는 하위폴더를 표시할 때 사용
../는 상위폴더를 표시할 때 사용
-->
</ul>
</html>4-1. 결과
mainmain.html
5. sub1.html 문서의 mark-up
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>sub1</title>
</head>
<body>
<h1>sub1.html</h1>
<ul>
<li><a href="../main.html">main</a></li>
<!--
sub1.html 문서 기준으로 main.html은 상위폴더에 위치한다.
-->
<li><a href="sub1.html">sub1</a></li>
<li><a href="sub2.html">sub2</a></li>
<li><a href="b/sub3.html">sub3</a></li>
<!--
sub1.html 문서 기준으로 sub3.html문서는 하위폴더인 b 폴더 내에 위치한다.
-->
</ul>
</body>
</html>sub1.html
6. sub2.html 문서의 mark-up
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>sub2</title>
</head>
<body>
<h1>sub2.html</h1>
<ul>
<li><a href="../main.html">main</a></li>
<li><a href="sub1.html">sub1</a></li>
<li><a href="sub2.html">sub2</a></li>
<li><a href="b/sub3.html">sub3</a></li>
</ul>
</body>
</html>sub2.html
7. sub3.html문서의 mark-up
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>sub3</title>
</head>
<body>
<h1>sub3.html</h1>
<ul>
<li><a href="../../main.html">main</a></li>
<li><a href="../sub1.html">sub1</a></li>
<li><a href="../sub2.html">sub2</a></li>
<li><a href="sub3.html">sub3</a></li>
</ul>
</body>
</html>sub3.html
블로그 이전 : https://rachelslab.tistory.com/