<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>글자관련태그</title>
</head>
<body>
<!-- h관련 태그 <h1~h6> : 제목표시 -->
<h1>h1 태그 입니다</h1>
<h2>h2 태그 입니다</h2>
<h3>h3 태그 입니다</h3>
<h4>h4 태그 입니다</h4>
<h5>h5 태그 입니다</h5>
<h6>h6 태그 입니다</h6>
<!-- 존재하지 않는 태그 사용시 일반 글꼴로 인식 -->
<h7>h7 태그 입니다</h7>
<hr> <!-- 수평선을 넣는 태그 -->
<h3>문단을 나누는 태그 : p, pre</h3>
<p>
문단을 나누는 태그는 p태그와 pre태그가 있다.<br>
p태그는 줄바꿈하고자 한다면 별도로 태그를 작성해야 됨<br>
그리고 공백은 한개의 공백만 표시하기 때문에 별도의
기호를 기술해야 한다.<br>
그리고 2칸 띄우기와 3칸띄우기도 있다.<br> <!-- 1칸 반 정도 -->
</p>
<p><!-- p>lorem : 의미없는 문단 넣기 -->
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt, atque,
necessitatibus adipisci itaque eum accusantium sint voluptas veritatis ipsum quaerat laudantium. Impedit molestiae nostrum tenetur facere nisi asperiores error obcaecati?
</p>
<pre>
pre태그는 시작태그부터 종료태그까지 입력된 내용 그대로 출력해줌
줄바꿈이라든지 혹은 여러개의 공백을 그대로 인식
그래서 시를 적어보겠습니다.
[산산조각 / 정호승]
룸비니에서 사온
흙으로 만든 부처님이
마룻바닥에 떨어져 산산조각이 났다
팔은 팔대로 다리는 다리대로
목은 목대로 발가락은 발가락대로
산산조각이 나
얼른 허리를 굽히고
서랍 속에 넣어두었던
순간접착제를 꺼내 붙였다
그 때 늘 부서지지 않으려고 노력하는
불쌍한 내 머리를
다정히 쓰다듬어 주시면서
부처님이 말씀하셨다
산산조각이 나면
산산조각을 얻을 수 있지
산산조각이 나면
산산조각으로 살아갈 수가 있지
</pre>
<hr>
<h3>그 밖의 글자를 다루는 태그들</h3>
일반글꼴 (태그로 감싸지 않는 텍스트)
<br><br>
<b>b: 글자를 굵게 표시하는 태그</b>
<br><br>
<strong> : 글자를 굵게 표시하는 태그 + 스크린리더(텍스트를 읽어주는 것. 강조해서 읽어줌)</strong>
<br><br>
<i>i : 글자를 기울여서 표시하는 태그</i>
<br><br>
<em>em(empasis) : 특히 강조할 때 글자를 기울여서 표시하는 태그</em>
<br><br>
<mark>mark : 형광펜</mark> 효과를 내는 태그
<br><br>
<u>u : 글자에 밑줄이 그어지는 태그</u>
<br><br>
<s>s : 글자에 취소선을 넣어주는 태그</s>
<br><br>
<small>small : 글자를 작게</small> 표현해 주는 태그
<br><br>
기본글자에 <sub>sub : 아래첨자</sub>를 나타내는 태그<br>
<sup>sup : 위첨자</sup>를 나타내는 태그
<br><br>
abbr : 줄임말 표시 <br>
<abbr title="hyper Text Markup Language"> HTML </abbr>란 월드 와이드 웹(World Wide Web)의 핵심 마크업 언어이다.
<br><br>
blockquote : 인용문
<blockquote>크게 성공한 사람은 그 성공에 비례할 만큼의 큰 노력이 숨어 있다. - 로렌스</blockquote>
<!-- 특수문자 입력 -->
<!-- escaping 문자 -->
<p> "특수문자" & <tag></tag> </p>
<p> "특수문자" & <tag></tag> </p> <br>
<p> "특수문자" & <tag></tag> </p>
<br><br>
<hr>
<h3>글자 관련 태그 응용(태그를 중첩하여 사용 가능)</h3>
<p>
태그를 중첩으로 사용 가능하다.<br>
<b><em>굵게, 기울임</em></b> 글꼴로 표현 가능하고,<br>
<s>취소선, <mark> 형광펜</mark></s>을 넣어 글자를 표현할 수 있음
</p>
</body>
</html>