HTML Quotations
1. HTML Quotations이란?
HTML에서 인용구(Quotations)는 문서 내에서 다른 사람의 말을 인용할 때 사용되는 태그입니다. HTML은 짧은 인용구와 긴 인용구를 각각 표현할 수 있는 태그를 제공합니다. 인용구는 웹 페이지에서 텍스트의 의미와 구조를 명확하게 하고, 가독성을 높이는 데 중요한 역할을 합니다.
2. HTML에서 인용구를 사용하는 태그
2.1 <q>
: 짧은 인용구 (Short Quotations)
<q>
태그는 짧은 인용구를 표시할 때 사용됩니다. 브라우저는 이 태그를 사용하여 텍스트를 자동으로 큰따옴표로 감싸줍니다.
<p>그녀는 이렇게 말했다: <q>HTML은 웹 페이지의 구조를 정의합니다.</q></p>
2.2 <blockquote>
: 긴 인용구 (Long Quotations)
<blockquote>
태그는 긴 인용문을 표시할 때 사용됩니다. 이 태그는 일반적으로 들여쓰기가 적용되며, 단락 단위로 다른 사람의 말을 인용할 때 적합합니다.
<blockquote>
"웹 표준은 웹 콘텐츠를 더욱 접근 가능하고 상호운용 가능하게 만드는 것을 목표로 합니다."
</blockquote>
3. HTML 인용구 속성
3.1 cite
속성
cite
속성은 인용문의 출처를 명시할 때 사용됩니다. 보통 URL을 사용하여 출처를 나타냅니다.
<blockquote cite="https://www.example.com">
"웹 표준은 웹 콘텐츠를 더욱 접근 가능하고 상호운용 가능하게 만드는 것을 목표로 합니다."
</blockquote>
4. 추가적인 인용 관련 태그
4.1 <abbr>
: 약어(Abbreviation)
<abbr>
태그는 약어나 줄임말을 정의할 때 사용됩니다.
<p>많은 개발자들은 <abbr title="HyperText Markup Language">HTML</abbr>을 사용합니다.</p>
4.2 <cite>
: 참조나 출처
<cite>
태그는 문서, 작품, 책, 영화 등의 제목을 나타내며, 인용의 출처를 명시할 때 사용됩니다.
<p><cite>HTML & CSS: Design and Build Websites</cite>는 웹 개발 초보자에게 매우 유용한 책입니다.</p>
5. HTML 인용구의 시각적 스타일링
HTML의 <q>
와 <blockquote>
태그는 기본적으로 브라우저에서 스타일이 지정되지만, CSS를 사용해 스타일을 커스터마이징할 수 있습니다.
<blockquote style="border-left: 5px solid gray; padding-left: 10px; font-style: italic;">
웹 표준은 웹 콘텐츠를 더욱 접근 가능하게 만드는 것을 목표로 합니다.
</blockquote>