[HTML / 시맨틱 마크업] 인용 (Quotations)

 

blockquote

📌 <blockquote>인용 내용</blockquote>

 

• 어떤 문단이나 내용 전체가 하나의 인용문일 경우 사용한다.
• q보다 더 많이 사용하는 편이다.
• 주로 들여쓰기를 한 것으로 그려진다.
• 인용문의 출처 URL은 cite 특성으로 나타낸다.

 

 

 

---

q

📌 <q></q>

 

• 문장 내에 작게 들어가는 인용문이 있을 경우 (별도 블록을 쓰지 않아도 될 짧은 인용문) 사용한다.
• 대부분의 브라우저에서 앞과 뒤에 따옴표를 붙여 표현된다.
• 인용문의 출처 문서나 메시지, URL은 cite 특성으로 나타낸다.

 

 

 

---

[참고] cite

📌 <cite></cite>

 

• 저작물의 출처를 표기할 때 사용한다.
• 보통 브라우저에서 기울임꼴로 그려진다.

 

 

 

---

인용 및 출처 표기 예시

 

• 전체가 하나의 인용문으로 <blockquote>로 감싸준다.
• <p> 태그를 이용해 문단 별로 나눠준다.
• 문서 내 짧은 인용문은 <q> 태그를 통해 나타낸다.
  👉🏼 큰 따옴표를 굳이 쓰지 않아도 q 태그가 문장의 앞 뒤에 따옴표를 덧붙여준다.
• <blockquote> 내에 cite 특성을 이용해 출처 URL을 나타낸다.
• <cite> 태그로 인용문의 출처를 나타낸다.

 

 

 

---

[참고 자료]

https://developer.mozilla.org/ko/docs/Web/HTML/Element/blockquote

<blockquote>: 인용 블록 요소 - HTML: Hypertext Markup Language | MDN

https://developer.mozilla.org/ko/docs/Web/HTML/Element/q

<q>: 인라인 인용문 요소 - HTML: Hypertext Markup Language | MDN

https://edu.goorm.io/learn/lecture/20583/%EA%B9%80%EB%B2%84%EA%B7%B8%EC%9D%98-html-css%EB%8A%94-%EC%9E%AC%EB%B0%8C%EB%8B%A4

구름HOME