CodeGym /자바 코스 /Frontend SELF KO /인용 태그

인용 태그

Frontend SELF KO

레벨 4 , 레슨 4

사용 가능

4.1 <blockquote> 요소

HTML에는 인용을 위한 특별한 태그들이 있어: <blockquote>, <cite>, 그리고 <q>. 이 태그들 각각은 특정 용도가 있고, 다양한 종류의 인용과 출처 표시를 위해 사용돼.

<blockquote> 태그는 큰 블록의 인용 텍스트를 강조하는 데 사용돼. 브라우저는 보통 그런 인용문을 왼쪽에 들여쓰기로 표시해서 본문과 구별하게 해줘.

사용 예:

HTML

    
      <blockquote>
        "The only limit to our realization of tomorrow is our doubts of today."
      </blockquote>

특징:

블록 요소야
보통 왼쪽에 들여쓰기로 표시돼
다른 블록 및 인라인 요소를 가질 수 있어
인용의 출처 URL을 지정하기 위해 cite 속성을 사용할 수 있어

cite 속성:

<blockquote> 태그의 cite 속성은 인용의 출처를 지정하는 데 사용돼. 이 속성은 시각적으로 표시되지는 않지만, 인용의 출처 정보를 저장하는 데 도움을 줘서 검색 엔진이나 다른 자동화된 텍스트 처리 시스템에 유용해.

cite 속성 사용 예:

HTML

    
      <blockquote cite="https://example.com/quote-source">
        "The only limit to our realization of tomorrow is our doubts of today."
      </blockquote>

4.2 <cite> 요소

<cite> 태그는 인용의 출처나 책, 기사, 영화 같은 작품의 이름을 나타내는 데 사용돼. <cite> 태그 안의 텍스트는 보통 이탤릭으로 표시돼.

사용 예:

HTML

    
      <p>인용 출처: <cite>Franklin D. Roosevelt</cite></p>

특징:

인라인 요소야
보통 이탤릭으로 표시돼
인용의 출처나 작품의 이름을 나타내는 데 사용돼

<blockquote>와 <cite> 예:

HTML

    
      <blockquote  cite="https://example.com/quote-source">
        "The only limit to our realization of tomorrow is our doubts of today."
        <cite>— Franklin D. Roosevelt</cite>
      </blockquote>

4.3 <q> 요소

<q> 태그는 짧은 인용을 강조하는 데 사용돼. 브라우저는 <q> 태그로 감싼 텍스트 주위에 자동으로 따옴표를 추가해.

사용 예:

HTML

    
      <p>알버트 아인슈타인이 말하길, <q>상상력이 지식보다 중요하다</q>.</p>

특징:

인라인 요소야
인용문 주변에 자동으로 따옴표를 추가해
본문에 인라인으로 짧은 인용을 나타내는 데 사용돼

<q>의 cite 속성:

<q> 태그의 cite 속성은 인용의 출처 URL을 표시하는 데 사용돼.

cite 속성 사용 예:

HTML

    
      <p>알버트 아인슈타인이 말하길, <q cite="https://example.com/einstein-quote">상상력이 지식보다 중요하다</q>.</p>

인용 태그의 결합 사용

이런 태그들은 더 구조적이고 정보가 풍부한 콘텐츠를 만들기 위해 함께 사용할 수 있어.

HTML

    
      <h1>인용 태그 사용 예시</h1>
      <p>
        알버트 아인슈타인이 말하길, <q cite="https://example.com/einstein-quote">상상력이 지식보다 중요하다</q>.
      </p>
      <blockquote cite="https://example.com/quote-source">
        "The only limit to our realization of tomorrow is our doubts of today."
        <cite>— Franklin D. Roosevelt</cite>
      </blockquote>

<blockquote>, <cite>, 그리고 <q> 태그들은 HTML에서 인용을 올바르게 구성하는 데 중요해. 이 태그들은 시각적인 인용 강조뿐만 아니라 검색 엔진과 자동화된 텍스트 처리 시스템에 중요한 의미론적 가치를 제공해.

이전 이전 레슨

다음 다음 레슨

코멘트

TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION