The
<i>tag in HTML is used to display text in italic style.
Unlike<em>, which emphasizes text semantically,<i>is generally used for stylistic purposes such as foreign words, technical terms, or titles of works.
It is an inline element.
Syntax
<i>Italic text here</i>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>I Tag Example</title>
<style>
.italic-text {
color: #2c3e50;
font-style: italic;
background-color: #f0f8ff;
padding: 2px 4px;
border-radius: 4px;
}
</style>
</head>
<body>
<h1>HTML <i> Tag Example</h1>
<p>
This is an example of <i class="italic-text" id="foreign-word" title="Italicized Text">italic text</i> in a paragraph.
</p>
<p>
Example: The Latin phrase <i>Carpe diem</i> means "Seize the day."
</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 <i> tag displays text in italic style for stylistic purposes without semantic emphasis.
Notes
<i>is an inline element and does not start a new line.- It is best used for technical terms, foreign words, or titles rather than emphasis.
- For semantic emphasis, use
<em>instead of<i>. - CSS can further style
<i>text with color, background, or font size.
Conclusion
The <i> tag is a stylistic tag used to italicize text in HTML.
It provides visual distinction without implying importance, making it ideal for stylistic purposes like foreign words or technical terms.