반응형
HTML (Hyper Text Markup Language)
: 웹 페이지에서 다른 페이지로 이동할 수 있도록 하는 것.
웹 페이지 (web page) : 월드 와이드 웹 상에 있는 개개의 문서
하이퍼링크
a 태그로 감싼 형태로 href에 url을 기입한다.
target으로 새 창에서 열지, 기존 창에서 열지 등등을 결정할 수 있다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- target기본값_self,생략가능 -->
<a href="https://www.naver.com/" target="_blank">네이버로 이동</a>
</body>
</html>
- list, class, id 활용
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box{
border-style: solid;
height: 1000px;
}
</style>
</head>
<ol>
<!-- # id / . class -->
<li><a href="#d1">영역1 가기</a></li>
<li><a href="#d2">영역2 가기</a></li>
<li><a href="#d3">영역3 가기</a></li>
<li><a href="#d4">영역4 가기</a></li>
</ol>
<!-- class는 공통사용가능, id는 유일해야함 -->
<div class="box" id = "d1">영역1</div>
<div class="box" id = "d2">영역2</div>
<div class="box" id = "d3">영역3</div>
<div class="box" id = "d4">영역4</div>
</body>
</html>
반응형
'HTML | CSS | Javascript' 카테고리의 다른 글
| [HTML|CSS] 3장 HTML 구성과 list (0) | 2024.02.08 |
|---|---|
| [HTML|CSS] 2장 기본 태그 (0) | 2024.02.08 |
| [HTML/CSS/Script] 12장 함수 (0) | 2024.02.01 |
| [HTML/CSS] 10.5장 Test (0) | 2024.01.29 |
| [HTML/CSS/Script] 9장 Script (0) | 2024.01.26 |