You may have noticed when reading some news or articles on the Internet that some of the words are written in italics. This is a very common and useful practice when you want to express a thought, or use a technical term, an expression from another language, et cetera.
Putting a word or an expression in italics is quite simple, we just have to use the idiomatic text element <i>.
Syntax
The <i> tag is used to differentiate words from the surrounding text. It can be used for the following:
Technical terms.
Idiomatic terms from another language (such as "Sic Mundus Creatus Est").
Thoughts (such as He wondered, "Can I learn Data Structures in Java?").
Taxonomic designations (such as the genus Canis).
The <i> tag puts the text it surrounds in italics. However, note that according to the MDN the use of this element is only recommended when there is no other element with appropriate semantics such as:
<em>, used to indicate emphasis or stress.<strong>, used to indicate importance.<mark>, used to indicate relevance.<cite>, used to mark up the name of a work, such as a book, game, or song.<dfn>, used to mark up the defining instance of a term.
We can use the <i> tag on words or whole texts. It is common to use it inside another HTML tag such as <p> or <span>.
<p><i>Web development</i> is the work that involves developing a web site for the Internet.</p>Examples
Now that you are more familiar with the <i> tag, let's see some examples.
Here we have an example of a technical term:
<p><i>Lorem ipsum</i> is the most popular filler text in history.</p>As you can see the term Lorem ipsum looks differently from the rest of the text so it is easier for those who are reading it to distinguish this word.
And here's an example of the taxonomic designations:
<p>The species <i>Homo sapiens</i> belongs to the kingdom <i>Animalia</i>.</p>For the readers it's easier to understand that these two expressions (Homo sapiens and Animalia) are scientific terms.
Next, an example of an expression from another language:
<p>The expression <i>Por favor</i> is widely used in Portuguese and Spanish and has the same meaning which is "please".</p>Conclusion
In this topic we've come across the idiomatic text element <i>. Usually, it's used to differentiate technical terms, thoughts, sentences from other languages, from the rest of the text. We've also learned that there are semantic elements that have their own usage and are recommended to use.