1. 블록레벨 텍스트태그 (위아래에 여백이 들어간다)

h1 ~ h6 : 제목태그
글자가 두껍다
h1이 제일 크고 6으로 갈 수록 작아진다.
p : 단락태그

블록레벨 : html에서 빈칸은 몇 칸이 들어가든 한 칸으로 표시

단, pre 태그에서는 빈 칸 그대로 표시

<아래 예>
* blockquote

KH정보교육원

* pre

    KH정보교육원

제목태그 h1 ~ h6

h1

제목태그1

h2

제목태그1

h3

제목태그1

h4

제목태그1

h5

제목태그1

h6

제목태그1

P

단락태그

br : 줄 바꿈


hr : 실선

---

2. 인라인레벨 텍스트태그

q: 인용구 (앞 뒤로 쌍따옴표 붙음) ▶ 윤세희
b: 글자 두껍게 ▶ 윤세희
strong: 글자 두껍게 ▶윤세희
u: 밑줄 ▶ 윤세희
ins: 밑줄 ▶ 윤세희
del: 중앙선 ▶ 윤세희
i : 이탤릭체 ▶ sehee yoon
em: 이탤릭체 ▶ sehee yoon
mark: 배경 노란색 ▶ 윤세희
sub: 글자를 작게 아래쪽에 배치 ▶ 윤세희
sup: 글자를 작게 위쪽에 배치 ▶ 윤세희

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<!-- 
    - 블록레벨 텍스트태그 (위아래에 여백이 들어간다)
        h1~h6: 제목태그
               글자가 두껍다
               h1이 제일 크고 6으로 갈수록 작아진다.
        p: 단락태그
 -->
    보통폰트
    <h1>제목태그1</h1>
    <h2>제목태그2</h2>
    <h3>제목태그3</h3>
    <h4>제목태그4</h4>
    <h5>제목태그5</h5>
    <h6>제목태그6</h6>

    <p>단락태그</p>
  
    <hr>
<!-- 
    br - 줄바꿈
    hr - 실선

    - 인라인레벨 텍스트태그
    q: 인용구(앞뒤로 쌍따옴표 붙음)
    *b: 글자 두껍게
    strong: 글자 두껍게
    *u: 밑줄
    ins: 밑줄
    del: 중앙선
    i: 이탤릭체
    em: 이탤릭체
    mark: 배경 노란색
    sub: 글자를 작게 아래쪽에 배치
    sup: 글자를 작게 위쪽에 배치
 -->
    <div><q>q태그</q></div>
    <p><b>b태그</b></p>
    
    <h1><q>q태그</q></h1>
    <p><b>b태그</b></p>

    <strong>strong태그</strong>
    <u>u태그</u>
    <ins>ins태그</ins>
    <del>del태그</del>
    <i>i태그</i>
    <em>em태그</em>
    <mark>mark태그</mark>
    <sub>sub</sub>태그
    <sup>sup</sup>태그
 
    <hr>
<!-- 블록레벨
    *HTML에서 빈칸은 몇칸이 들어가던 한칸으로 표시
    단 pre 태그에서는 그대로 표시
-->
    <blockquote>KH정보교육원</blockquote>
    <pre>
        KH정보교육원</pre>
</body>
</html>