<em>

You’re reading the English version of this content since no translation exists yet for this locale. Help us translate this article!

HTML <em> 요소는 강조를 표시할때 사용합니다. <em> 요소는 중첩될수 있으며, 중첩의 단계는 강조의 단계를 나타냅니다.

Content categories Flow content, phrasing content, palpable content.
Permitted content Phrasing content.
Tag omission None, both the starting and ending tag are mandatory.
Permitted parents Any element that accepts phrasing content.
Permitted ARIA roles Any
DOM interface HTMLElement Up to Gecko 1.9.2 (Firefox 4) inclusive, Firefox implements the HTMLSpanElement interface for this element.

속성

이 요소는 전역 속성만을 포함합니다.

사용 참고

일반적으로 이 요소는 이탤릭체로 표시됩니다. 하지만, 이 요소는 단순히 이탈릭 타입을 표시하기 위해 사용되어서는 안됩니다.(단순히 이탈릭 타입을 표시하고 싶다면, CSS 스타일링을 사용하세요).

<i> vs. <em>

신입 개발자들은 글자를 강조하는데에 왜 이렇게 많은 요소들이 있는지에 대해 혼란스러워합니다. 아마도 <i>와 <em>가 그중 흔한 경우일것입니다.. 왜 <em></em><i></i>를 사용하는걸까요? 분명 그들은 같은 결과를 나타내는데 말입니다.

하지만 전혀 그렇지 않습니다. 두 태그 모두 기본적으로 이탤릭체로 렌더링되지만 의미론적 뜻이 다릅니다. <em> 은 내용의 강조를 나타내는데에 비해 <i> 태그는 일반적인 글자와 분리된 글자를 나타낼 때 사용합니다. (책이나 영화의 이름, 외국 단어, 혹은 단어가 의미론적 뜻 대신에 단어의 정의를 나타낼 때는 <cite> 를 사용해야 합니다.

<em> 은 이런식으로 쓰일수 있습니다: "Just do it already!", 또는: "We had to do something about it". 여기서 이탤릭체로 표현된 단어를 읽는 사용자나 소프트웨어는 이 단어는 강조된 단어라고 판단할 겁니다.

<i> 는 이런식으로 쓰일수 있습니다: "The Queen Mary sailed last night". 여기서 "Queen Mary" 단어에 추가된 강조나 중요성은 없습니다. 이건 Mary라는 이름을 가진 여왕이 아니라, Queen Mary 라는 이름을 가진 배를 나타내는것 뿐입니다. <i> 에 대한 또 다른 예시로 다음과 같은 문장이 있습니다: "The word the is an article".

예제

The <em> element is often used to indicate an implicit or explicit contrast.

<p>
  예전에 <em>block-level</em> 컨텐츠라 불리던것은 이제 HTML5에서 <em>flow</em> 컨텐츠라고 불립니다.
</p>

결과

예전에 block-level 컨텐츠라 불리던것은 이제 HTML5에서 flow 컨텐츠라고 불립니다.

명세

명세 상태 주석
HTML Living Standard
The definition of '<em>' in that specification.
Living Standard  
HTML5
The definition of '<em>' in that specification.
Recommendation  
HTML 4.01 Specification
The definition of '<em>' in that specification.
Recommendation  

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
emChrome Full support 1Edge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes

Legend

Full support  
Full support

같이 보기