7.6 KiB
텍스트
Headings
h1, h2, h3, h4, h5, h6
구획 제목을 나타냅니다. 구획 단계는 <h1>이 가장 높고 <h6>은 가장 낮습니다.
hgroup
문서 구획의 다단계 제목을 나타냅니다. 다수의 <h1> ~ <h6> 요소를 묶을 때 사용합니다.
<hgroup>
<h1>Calculus I</h1>
<h2>Fundamentals</h2>
</hgroup>
<p>This course will start with a brief introduction about the limit of a function. Then we will describe how the idea of derivative emerges in the Physics and Geometry fields. After that, we will explain that the key to master calculus is …</p>
Paragraph
p
하나의 문단을 나타냅니다.
pre
미리 서식을 지정한 텍스트를 나타내며, HTML에 작성한 내용 그대로 표현합니다.
<p>Some species live in houses where they hunt insects attracted by artificial light.</p>
강조
em
텍스트의 강조를 나타냅니다. <em> 요소를 중첩하면 더 큰 강세를 뜻하게 됩니다.
strong
중대하거나 긴급한 콘텐츠를 나타냅니다. 보통 브라우저는 굵은 글씨로 표시합니다.
mark
현재 맥락에 관련이 깊거나 중요해 표시 또는 하이라이트한 부분을 나타냅니다.
i
텍스트에서 어떤 이유로 주위와 구분해야 하는 부분을 나타냅니다.
b
독자의 주의를 요소의 콘텐츠로 끌기 위한 용도로 사용합니다. 그 외의 다른 특별한 중요도는 주어지지 않습니다.
u
글자로 표현하지 않는 주석을 가진 것으로 렌더링 해야 하는 텍스트를 나타냅니다.
s
글자에 취소선, 즉 글자를 가로지르는 선을 그립니다.
strike
글자에 취소선을 그립니다.
수정
ins
문서에 추가된 텍스트의 범위를 나타냅니다.
del
문서에서 제거된 텍스트의 범위를 나타냅니다.
small
덧붙이는 글이나, 저작권과 법률 표기 등의 작은 텍스트를 나타냅니다.
<p>I am <em>glad</em> you weren't <em>late</em>.</p>
<p>This liquid is <strong>highly toxic</strong>.</p>
big
포함된 텍스트를 주변 텍스트보다 한 수준 더 큰 글꼴 크기로 렌더링합니다.
tt
모노스페이스 글꼴을 사용하여 표시합니다.
인용
blockquote
안쪽의 텍스트가 긴 인용문임을 나타냅니다. 주로 들여쓰기를 한 것으로 그려집니다. 인용문의 출처 URL은 cite 속성으로, 출처 텍스트는 <cite> 요소로 제공할 수 있습니다.
- cite
<p>Here below is a blockquote..</p>
<blockquote cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote">
<p>The <strong>HTML <code><blockquote></code> Element</strong> (or <em>HTML Block
Quotation Element</em>) indicates that the enclosed text is an extended quotation.</p>
</blockquote>
q
둘러싼 텍스트가 짧은 인라인 인용문이라는것을 나타냅니다.
- cite
<p>The quote element — <code><q></code> — is <q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q">intended
for short quotations that don't require paragraph breaks.</q></p>
cite
저작물의 출처를 표기할 때 사용하며, 제목을 반드시 포함해야 합니다.
- title
<p>According to the <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote">
<cite>MDN blockquote page</cite></a>:
</p>
<p>The quote element — <code><q></code> — is <q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q">intended
for short quotations that don't require paragraph breaks.</q> -- <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q">
<cite>MDN q page</cite></a>.</p>
단축
abbr
준말 또는 머리글자를 나타냅니다.
- title
<p>I think <abbr title="Reverend">Rev.</abbr> Green did it in the kitchen with the chainsaw.</p>
### acronym
단어의 두문자어 또는 약어를 표시합니다.
정의
dfn
현재 맥락이나 문장에서 정의하고 있는 용어를 나타냅니다. <dfn>에서 가장 가까운 <p>, <dt>/<dd> 쌍, <section> 조상 요소를 용어 정의로 간주합니다.
<p>A <dfn id="def-validator">validator</dfn> is a program that checks for syntax errors in code or documents.</p>
루비
ruby
루비 주석을 나타냅니다. 루비 주석은 동아시아 문자의 발음을 표기할 때 사용합니다.
rb
<ruby> 표기의 기반 텍스트 구성요소(루비 주석을 적용하려는 글자)를 나눌 때 사용합니다.
rt
동아시아 문자의 루비 주석에서 발음, 번역 등을 나타내는 텍스트 부분을 지정합니다.
rp
<ruby> 요소를 사용한 루비 주석을 지원하지 않는 경우 보여줄 괄호를 제공할 때 사용합니다.
<ruby>
明日 <rp>(</rp><rt>Ashita</rt><rp>)</rp>
</ruby>
첨자
sub
활자 배치를 아래 첨자로 해야 하는 인라인 텍스트를 지정합니다.
sup
활자 배치를 위 첨자로 해야 하는 인라인 텍스트를 지정합니다.
<p>My birthday is on the 25<sup>th</sup> of May 2001.</p>
<p>If x<sup>2</sup> is 9, x must equal 3 or -3.</p>
코드
code
짧은 코드 조각을 나타내는 스타일을 사용해 자신의 콘텐츠를 표시합니다.
var
수학 표현 또는 프로그래밍에서 변수의 이름을 나타냅니다.
kbd
키보드 입력, 음성 입력 등 임의의 장치를 사용한 사용자의 입력을 나타냅니다.
samp
컴퓨터 프로그램 출력의 예시(혹은 인용문)를 나타냅니다.
<pre><code>var para = document.querySelector('p');
para.onclick = function() {
alert('Owww, stop poking me!');
}</code></pre>
<p>Select all the text with <kbd>Ctrl</kbd>/<kbd>Cmd</kbd> + <kbd>A</kbd>.</p>
<p>In the above JavaScript example, <var>para</var> represents a paragraph element.</p>
데이터
data
주어진 콘텐츠를 기계가 읽을 수 있는 해석본과 연결합니다.
- value
<ul>
<li><data value="398">Mini Ketchup</data></li>
<li><data value="399">Jumbo Ketchup</data></li>
<li><data value="400">Mega Jumbo Ketchup</data></li>
</ul>
시간
time
시간의 특정 지점 또는 구간을 나타냅니다.
- datetime
<time datetime="2016-01-20">20 January 2016</time>
<time datetime="2016-01-20T19:30+01:00">7.30pm, 20 January 2016 is 8.30pm in France</time>
주소 또는 연락처
address
가까운 HTML요소의 주소나 연락처 정보를 나타냅니다.
<address>
<a href="mailto:jim@rock.com">jim@rock.com</a><br>
<a href="tel:+13115552368">(311) 555-2368</a>
</address>
링크
a
다른 페이지나 같은 페이지의 어느 위치, 파일, 이메일 주소와 그 외 다른 URL로 연결할 수 있는 하이퍼링크를 만듭니다.
-
href
http: | mailto: | tel:
-
download
다운로드 할지를 묻는 대화상자가 표시됩니다.
-
target
_self | _blank | _parent | _top
<p>I'm creating a link to
<a href="https://www.mozilla.org/en-US/">the Mozilla homepage</a>.
</p>
줄바꿈
br
텍스트 안에 줄바꿈(캐리지 리턴)을 생성합니다. 주소나 시조 등 줄의 구분이 중요한 내용을 작성할 때 유용합니다.
wbr
현재 요소의 줄 바꿈 규칙을 무시하고 브라우저가 줄을 바꿀 수 있는 위치를 나타냅니다.
수평선
hr
이야기 장면 전환, 구획 내 주제 변경 등, 문단 레벨 요소에서 주제의 분리를 나타냅니다.