🚀 LEVEL UP TO SENIOR:Unlock 500+ Advanced Practical Challenges & Exercises.
🎓 COURSERA PARTNER:Earn professional Google, Meta, and IBM certificates to supercharge your resume.
REFERENCEhtml

html Documentation

LOADING ENGINE...

<i>

AI & DATA SCIENCE // i-tag

The <i> element renders text in italics to represent an alternate voice or mood — technical terms, foreign phrases, or a character's thoughts — without adding emphasis.

Syntax

The term <i>déjà vu</i> comes from French.

Deep Dive Course

**`<i>`** italicizes text but, like `<b>`, carries **no semantic emphasis** in HTML5 — it marks text that is set apart in tone or kind from the rest, such as a foreign-language phrase, a taxonomic name (like *Homo sapiens*), a ship's name, or a character's internal thoughts in a story. If you actually want to stress a word to change the meaning of a sentence, use `<em>` instead, which assistive technology treats as emphasized speech.

1Understanding <i>

`<i>` italicizes text but, like <b>, carries no semantic emphasis in HTML5 — it marks text that is set apart in tone or kind from the rest, such as a foreign-language phrase, a taxonomic name (like *Homo sapiens*), a ship's name, or a character's internal thoughts in a story. If you actually want to stress a word to change the meaning of a sentence, use <em> instead, which assistive technology treats as emphasized speech.

💡

A quick test: technical terms, foreign words, and titles of works are usually <i>. Words you'd raise your voice for when reading aloud are usually <em>.

editor.html
<p>The <i>T. rex</i> was a large carnivorous dinosaur.</p>
localhost:3000

2Practical Example

Here is a real-world application of <i> showing how it is used in production HTML.

editor.html
<!-- A character's internal thought in narrative text -->
<p>She looked at the letter. <i>This can't be right</i>, she thought.</p>
localhost:3000

3Best Practices

Follow these guidelines when working with <i>:

1. Use <i> for foreign words, technical terms, and taxonomic names

2. Use <em> instead when you want to change the meaning/stress of a sentence

3. Use <cite> specifically for the titles of creative works, not <i>

⚠️

Tip: A quick test: technical terms, foreign words, and titles of works are usually <i>. Words you'd raise your voice for when reading aloud are usually <em>.

editor.html
<p>The <i>T. rex</i> was a large carnivorous dinosaur.</p>
localhost:3000

Examples

Example 01Basic Usage
<p>The <i>T. rex</i> was a large carnivorous dinosaur.</p>
Example 02Advanced Example
<!-- A character's internal thought in narrative text -->
<p>She looked at the letter. <i>This can't be right</i>, she thought.</p>

Best Practices

  • Use for foreign words, technical terms, and taxonomic names
  • Use instead when you want to change the meaning/stress of a sentence
  • Use specifically for the titles of creative works, not

Interview Question

When would you choose <i> over <em>?

Hint: Think about whether removing the styling changes the sentence's meaning.

Use <i> when text is set apart in tone or kind — a foreign phrase, a scientific name, a ship name — but reading it with or without stress doesn't change the sentence's meaning. Use <em> when the italics ARE the emphasis: 'I never said she stole it' vs '<em>I</em> never said she stole it' — changing which word is emphasized changes the meaning, which is exactly what <em> is for.

Exercises

EasyPractice using <i> in a real scenario.
View Solution
<p>The <i>T. rex</i> was a large carnivorous dinosaur.</p>

Frequently Asked Questions

When would you choose <i> over <em>?

Use when text is set apart in tone or kind — a foreign phrase, a scientific name, a ship name — but reading it with or without stress doesn't change the sentence's meaning. Use when the italics ARE the emphasis: 'I never said she stole it' vs 'I never said she stole it' — changing which word is emphasized changes the meaning, which is exactly what is for.

Related Functions

em-tagb-tagcite-tag