[HTML] 텍스트 입력하기

* 제목을 나타내는 <hn>태그

제목 스타일을 미리 태그 형태로 만든 것이 바로 제목 태그이다.

- 기본형 : <hn>제목</hn>

(...생략...)
<h1>HTML이란?</h1>
<h2>HTML은 웹 문서를 만들기 위하여 사용하는 웹 언어의 종류이다.</h2>
<h2>하이퍼텍스트를 작성하기 위해 개발되었다.</h2>
<h3>우리 모두 HTML을 공부합시다.</h3>
(...생략...)

<hn> 태그에서 h는 제목을 뜻하는 heading을 줄인 말이다.

n의 자리에는 1~6의 숫자가 들어가며 제목 텍스트를 크기별로 표시할 수 있다.

<h1>이 가장 큰 제목이고 <h2>, <h3> ... <h6>의 순서로 크기가 작아진다.

 

* 인용할 때 쓰는 <blockquote> 태그

- 기본형 : <blockquote>인용문<blockquote>

(...생략...)
<blockquote>
비타민C와 비타민P는<br>혈액순환, 감기예방 등에 좋은 것으로 알려져 있다.
</blockquote>
(...생략...)

 

* 텍스트를 굵게 표시하는 <strong>, <b> 태그

- 기본형 : <strong>굵게 강조할 텍스트</strong>

- 기본형 : <b>굵게 표시할 텍스트</b>

(...생략...)
<h1>비타민</h1>
<p>물질대사, 생리기능을 조절하는 필수영양소를 <b>비타민</b>이라고 한다.</p>
<p>그 중에 비타민C와 비타민P는 <strong>혈액순환, 감기예방</strong> 등에 좋다고 한다.</p>
(...생략...)

 

* 기울인 텍스트를 입력해주는 <em>, <i> 태그

- 기본형 : <em>이탤릭체로 강조할 텍스트</em>

- 기본형 : <i>이탤릭체로 표시할 텍스트</i>

<em>태그는 문장 중에서 특별히 강조하고 싶은 부분에 사용하고,

단순히 다른 텍스트와 구별하기 위해 표시한다면 <i>태그를 사용한다.

(...생략...)
<h1>비타민</h1>
<p><em>물질대사, 생리기능을 조절하는 필수영양소</em>를 <b>비타민</b>이라고 한다.</p>
<p>그 중에 <i>비타민C</i>와 <i>비타민P</i>는<br>
<strong>혈액순환, 감기예방</strong> 등에 좋다고 한다.</p>
(...생략...)

 

* 다양한 텍스트 관련 태그

종류	설명	예시
<abbr>	줄임말을 표시하고 title 속성을 함께 사용할 수 있다.	<abbr title = "Internet of Thing">IoT</abbr>
<cite>	웹 문서나 포스트에서 참고 내용을 표시한다.	<p>내가 경험한 가장 흥미진진한 일은 누군가를 만나는 일이다 - 영화, <cite>'비포선셋'</cite> 중</p>
<code>	컴퓨터 인식을 위한 소스 코드이다.	<code>function savetheLocal()</code>
<small>	부가 정보처럼 작게 표시하는 텍스트이다.	<p>가격 : 13,000원 <small>(부가세 별도)</small></p>
<sub>	아래 첨자를 표시한다.	<p>물의 화학식은 H<sub>2</sub>O입니다.</p>
<sup>	위 첨자를 표시한다.	<p>E = mc<sup>2</sup></p>
<s>	취소선을 표시한다.	<p><s>34,000원</s>19,000원</p>
<u>	밑줄을 표시한다.	<u>텍스트에 단순히 밑줄 긋기</u>
<ins>	공동 작업 문서에서 새로운 내용을 삽입한다.	<ins>새로운 내용을 삽입합니다.</ins>
<del>	공동 작업 문서에서 기존 내용을 삭제한다.	<del>기존 내용을 삭제합니다.</del>