[HTML] 인용문 삽입하는 법

코드를 작성하다보면 인용문을 삽입해야하는 경우가 발생합니다. HTML에서 인용문을 삽입하는 방법은 2가지로 <blockquote> </blockquote> 태그를 사용하는 방식과 <q> </q> 태그를 사용하는 방식이 있습니다. 전자는 block-level 태그로 인용문이 자동으로 줄바꿈과 들여쓰기되어 출력됩니다. 반면, 후자는 inline-level 태그로 줄바꿈과 들여쓰기가 되지 않은 채로 출력됩니다. 대신, 인용문의 구분을 위해 인용문의 처음과 끝에 따옴표("")가 자동으로 출력됩니다.

---

 

인용문 삽입하는 법 1 : <blockquote> </blockquote> 태그

---

인용문을 삽입하기 위해서는 인용되는 부분을 <blockquote> </blockquote> 태그로 감싸시면 됩니다. 해당 태그를 사용해 감싸진 텍스트는 들여쓰기가 되어있어 태그 밖의 다른 텍스트와 비교했을 때 구분됩니다. <blockquote> 태그는 block-level 태그이기 때문에 인용문이 자동으로 줄바꿈되어 표시됩니다. 

 

<p> 텍스트 태그 실습 예제를 진행하겠습니다. <br> 다음과 같은 텍스트를 입력해주세요.
    <blockquote>"Hello World!"</blockquote> 모두 입력하셔야합니다.
</p>

 

<blockquote> 태그 사용

 

인용문 삽입하는 법 2 : <q> </q> 태그

---

인용문을 삽입하는 방법으로는 <q> 태그를 사용하는 방법도 있습니다. 인용되는 텍스트를 <q> </q> 태그로 감싸시면 됩니다. <q> 태그는 자동으로 따옴표("")가 삽입되며 <blockquote> 태그와는 달리 inline-level 태그이기 때문에 줄바꿈과 들여쓰기를 하지 않습니다.

 

<p> 텍스트 태그 실습 예제를 진행하겠습니다. <br> 다음과 같은 텍스트를 입력해주세요.
    <q>"Hello World!"</q> 모두 입력하셔야합니다.
</p>

 

<q> 태그 사용