The
<em>tag in HTML is used to indicate emphasized text.
Browsers typically render<em>text in italic style, but unlike<i>, it carries semantic importance.
Screen readers give it special emphasis, making it important for accessibility.
It is an inline element.
Syntax
<em>Emphasized text here</em>Attributes
| Attribute | Description |
|---|---|
class | Assigns one or more class names for styling. |
id | Assigns a unique identifier to the element. |
style | Adds inline CSS styles to customize appearance. |
title | Provides additional information as a tooltip. |
Example
<!DOCTYPE html>
<html>
<head>
<title>EM Tag Example</title>
<style>
.emphasis {
color: #d35400;
font-style: italic;
background-color: #fff8e1;
padding: 2px 4px;
border-radius: 4px;
}
</style>
</head>
<body>
<h1>HTML <em> Tag Example</h1>
<p>
This sentence contains <em class="emphasis" id="important-text" title="Emphasized Text">emphasized text</em> that conveys importance.
</p>
<p>
Example: You should <em>read the instructions carefully</em> before starting the task.
</p>
</body>
</html>Output
Browser Output
Use our TryIt Editor to see the output.
Browser Support
 Chrome |  Firefox |  Edge |  Safari |  Opera |  IE9+ |
|---|---|---|---|---|---|
| ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes |
The <em> tag visually italicizes text and semantically emphasizes it, providing meaning for accessibility and screen readers.
Notes
<em>is an inline element used for semantic emphasis.- Screen readers pronounce emphasized text with more stress, improving accessibility.
- CSS can further style
<em>text with color, font size, or background. - For purely stylistic italics without semantic meaning, use
<i>.
Conclusion
The <em> tag is essential for emphasizing text semantically in HTML.
It conveys importance for both human readers and assistive technologies while also rendering in italic style.
