Definition
The <em>
tag is used to add semantic emphasis to words or text compared to the surrounding text.
Example
<p>You should <em>not</em> drive on the wrong side of the road.</p>
You should not drive on the wrong side of the road.
Usage
- You must use an opening and closing tag.
- Content displayed in an
<em>
tag is shown as italic. This can be further styled using CSS. - The following use cases show how using the
<em>
tag can change the meaning of the sentence, and as such becomes integral to the content:- General statement:
<p>Cats are cute animals.</p>
- Statement stressing that cats are cute, in contrast to say, dogs:
<p><em>Cats</em> are cute animals.</p>
- Statement arguing that cats are cute, in contrast to someone arguing that they are not cute:
<p>Cats <em>are</em> cute animals.</p>
- In this statement you might be arguing that cats are cute animals, not mean animals.
<p>Cats are <em>cute<em> animals.</p>
- If someone asserted that cats were human, you might want to stress that they are in fact, animals:
<p>Cats are cute <em>animals</em>.</p>
- General statement:
Attributes
The <em>
element only supports the Global Attributes.
Best Practices
- You should not use the
<em>
element for generic italic styling. If you wish to make text or even a paragraph stand out from the rest of the content (for example, a lead paragraph), then the<i>
element should be used. - The
<em>
element is used to stress certain words which may change the meaning or meaning of the sentence, not denote importance. To stress importance, use the<strong>
tags. - You can read how Google uses
<em>
elements for ranking purposes here
Specification
Browser Support
Desktop
Chrome | Edge | Firefox | IE | Opera | Safari |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |
Mobile
Android Webview | Chrome Android | Firefox Android | Opera Android | iOS Safari | Samsung Internet |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |