HTML

HTML : Hyper Text Markup Language

하이퍼 텍스트를 가장 중요한 특징으로 하는, 마크업이라는 형식을 가진, 컴퓨터 프로그래밍 언어

Tag : <Tag name> 로 열려서 <Tag name/>으로 닫힌 형태로 브라우저에 제공해야 한다.

Tag name 뒤에 속성을 붙여서 사용도 가능하다. 속성 사이에 순서는 상관이 없다.

HTML은 아래와 같은 형태로 구성된다.

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
  </body>
</html>

doctype

<!DOCTYPE html> : Document type 이 어떤 방식의 HTML 인지 declaration.

html 부 : html 전체를 담는 부분.

html : <html> </html>

헤드부 : 부가적인 정보를 담는 부분.

헤드 : <head> </head>

탭 제목 : <title> </title>

메타 : <meta>

UTF-8 : <meta charset="UTF-8">

본문부 : 본문의 내용을 담는 부분.

본문 : <body> </body>

제목
- 태그 안의 내용이 제목으로 인식된다.
- 웹에서 검색 시, 내용보다 우선순위를 가지게 되어 유리하다.
```
<h1>H1</h1>
<h2>H2</h2>
<h3>H3</h3>
<h4>H4</h4>
<h5>H5</h5>
<h6>H6</h6>
```
굵은 글씨
- 태그 안의 내용이 굵은 글씨로 표현된다.
```
<strong>STRONG</strong>
```
링크(anchor)
- 태그 안의 내용에 하이퍼링크가 걸리게 되며, 아래 속성들을 통해 부가적인 기능을 활용할 수 있다.
- href="Link" : Link 주소를 연다.
- target="_blank" : 새 창으로 연다.
- title="타이틀" : 해당 구문에 마우스를 올리면 "타이틀"이란 문구를 미리 보여준다.
```
<a href="https://hyeonsik.tistory.com/" target="_blank" title="SW 꿈나무 티스토리 블로그">BLOG</a>
```

리스트

태그 안의 내용을 리스트로 인식한다.
- 번호가 없는 리스트 그룹 : <ul> </ul> unordered list
- 번호가 있는 리스트 그룹 : <ol> </ol> orderd list

<ul>
    <li>unordered list 1</li>
    <li>unordered list 2</li>
    <li>unordered list 3</li>
</ul>
<ol>
    <li>ordered list 1</li>
    <li>ordered list 2</li>
    <li>ordered list 3</li>
</ol>

단락
- 태그 안의 내용을 하나의 단락으로 인식한다.
```
<p>단락 1</p>
<p>단락 2</p>
<p>단락 3</p>
```
줄바꿈
- 태그 부분에서 줄바꿈을 행한다.
```
줄바꿈 1<br>
줄바꿈 2<br>
줄바꿈 3<br>
```

저작자표시 (새창열림)