참조 또는 인용 문구를 나타내는 방법 - q, blockquote

인용임을 나타내는 문구 또는 참조를 나타내는 문구 작성하는 방법
2 min read

인용

다른 블로그나 웹 사이트의 글을 인용할 경우, 인용임 나타내는 태그에는 <blockquote><q>가 있습니다. <blockquote> 태그는 새로운 문단에서 인용하는 블록 요소이고, <q> 태그는 문단 안에서 인용할 때 사용하는 인라인 요소입니다.

 

기본형

<blockquote cite="xxx">...</blockquote>
<q cite="xxx">...</q>

인용문의 출처는 cite 속성으로 나타냅니다. cite 속성 입력은 선택 사항이고, 웹 브라우저에서는 보이지 않습니다.

 

blockquote

blockquote 요소의 기본 모양은 양쪽에 여백이 있는 것입니다.

<p>Blockquote</p>
<blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla.</p></blockquote>

 

q

q 요소의 기본 모양은 인용 문구를 큰 따옴표로 감싸는 것 입니다.

<p>Lorem ipsum dolor sit amet <q cite="https://google.com">consectetur adipiscing</q> elit.</p>

 

예제

인용문을 꾸미는 몇 가지 예제를 살펴봅니다.

인용문(blockquote) 스타일링하기

 

기타 HTML 참조

You may like these posts

  • 표 만들 때 사용하는 태그 <table> : 표를 만듭니다. <tr> : 행을 만듭니다. <th> : 열의 제목이 들어가는 셀을 만듭니다. <td> : 내용이 들어가는 셀을 만듭니다. <thead>, <tbody>, …
  • 표(table)에 제목이나 설명을 덧붙일 때 <caption> 태그를 사용하지만 <figcaption> 태그를 사용할 수도 있습니다. 두 가지 방법 모두 알아보겠습니다.   caption 먼저 <caption> 태그는 <t…
  • 목록에는 순서가 있는 목록(Ordered List), 순서가 필요하지 않은 목록(Unordered List), 설명 목록(Description List) 세 가지가 있습니다. 순서가 있는 목록(OL) 순서가 없는 목록(UL) 설명 목록(DL) 순서 있는 목록 순서가 필요한…
  • pre HTML에서는 아무리 많은 공백을 넣더라도 브라우저 창에는 한 개의 공백만 표시됩니다. 연속한 여러 개의 빈칸이나 탭, 줄바꿈을 하나의 빈 칸으로 인식하고 페이지의 내용이 한 줄로 표시합니다. 만약 입력한 그대로 출력되도록 하려면 <pre> 태그를 이용합니다. …
  • 인용 다른 블로그나 웹 사이트의 글을 인용할 경우, 인용임 나타내는 태그에는 <blockquote>와 <q>가 있습니다. <blockquote> 태그는 새로운 문단에서 인용하는 블록 요소이고, <q> 태그는 문단 안에서 인용할 때 사용하는 인라인 …
  • 사용자가 여러 옵션 중에서 선택하도록 하고 싶을 때 드롭다운 목록을 사용합니다. 드롭다운 목록이란 클릭했을 때 옵션들이 요소 아래쪽으로 펼쳐지기 때문에 붙여진 이름입니다. 공간을 최소한을 사용하면서 여러 옵션을 표시하려면 드롭다운 목록이 가장 적당합니다. 목차 select …

Post a Comment