figure태그와 함께 사용할 수 있는 cite blockquote q 태그

figure 태그

 <figure> 요소는 독립적인 콘텐츠를 표현합니다. <figcaption> 요소를 사용해 설명을 붙일 수 있습니다. 피규어, 설명, 콘텐츠는 하나의 단위로 참조됩니다.

 

보통  <figure>는 주 문서 플로우가 참조하지만, 다른 부분이나 부록으로 이동해도 문제 없는 이미지, 삽화, 도표. 코드 조각 등을 맡습니다. 

 

 

 

 

 

cite 태그

<cite> 요소는 저작물의 출처를 표기할 때 사용하며, 제목을 반드시 포함해야 합니다. 적절한 맥락 아래에서는 출처를 축약해서 표기할 수 있습니다.

 

시, 논문, 에세이 등등 다양한 저작물들에 사용

 

W3C 명세는 <cite> 요소로 저작물의 출처를 표기할 때 저작자도 표기할 수 있음을 명시하고 있습니다. 그러나 정반대로, WHATWG 명세는 사람 이름을 어떤 상황에서도 절대 포함하지 말아야 한다고 적혀있다는 점을 알아두는 것이 좋습니다.

 

보통 브라우저는 <cite> 요소를 그릴 때 기울임꼴로 표현합니다. 기울임꼴을 제거하려면 CSS font-style 속성을 <cite>에 적용하세요.

 

 

 

 

 

blockquote 태그 : 인용 블록 요소

<blockquote> 요소는 안쪽의 텍스트가 긴 인용문임을 나타냅니다. 주로 들여쓰기를 한 것으로 그려집니다.

 

인용문의 들여쓰기를 바꾸려면 CSS margin-left와 margin-right, 혹은 margin 단축 속성을 사용하세요.

별도의 블록을 쓰지 않아도 될 짧은 인용문은 <q> 요소를 사용하세요.

 

특성

cite 인용문의 출처 문서나 메시지를 가리키는 URL. 인용문의 맥락 혹은 출처 정보를 가리킬 용도입니다.

<figure>
    <blockquote cite="https://www.huxley.net/bnw/four.html">
        <p>Words can be like X-rays, if you use them properly—they’ll go through anything. You read and you’re pierced.</p>
    </blockquote>
    <figcaption>—Aldous Huxley, <cite>Brave New World</cite></figcaption>
</figure>

 

 

 

 

q 태그 : 인라인 인용문 요소

<q>요소는 둘러싼 텍스트가 짧은 인라인 인용문이라는것을 나타냅니다. 대부분의 브라우저에서는 앞과 뒤에 따옴표를 붙여 표현합니다. <q>는 줄 바꿈이 없는 짧은 경우에 적합합니다. 긴 인용문은 <blockquote> 요소를 사용하세요.

 

특성

cite 인용문의 출처 문서나 메시지를 가리키는 URL. 인용문의 맥락 혹은 출처 정보를 가리킬 용도입니다.

<p>When Dave asks HAL to open the pod bay door, HAL answers: <q cite="https://www.imdb.com/title/tt0062622/quotes/qt0396921">I'm sorry, Dave. I'm afraid I can't do that.</q></p>