HTML Emphasised Text Tutorial

HTML Emphasised Text Element

HTML Emphasised <em> tag is used to define emphasised text in an HTML document.

Example

A simple Emphasised element is shown in the following example.

index.html

<!DOCTYPE html>
<html>
    <body>
        <p>normal text <em>emphasized text</em></p>
    </body>
</html>

Note: HTML Emphasised element starts with the tag <em> and ends with an end tag </em>.

Default CSS for HTML em Element

By default, following CSS properties are set for a Emphasised element.

font-style: italic;

Inline Style for HTML Emphasised Element

We can change the style of Emphasised element through inline styling using style attribute.

In the following example, we have set the color as red for the Emphasised element.

index.html

<!DOCTYPE html>
<html>
    <body>
        <p>normal text <em style="color:red;">emphasized text</em></p>
    </body>
</html>

Apply CSS for HTML Emphasised Element

We can apply CSS for all Emphasised elements using the em tag.

index.html

<!DOCTYPE html>
<html>
    <head>
        <style>
            em {
              color:red;
            }
          </style>
    </head>
    <body>
        <p>normal text <em>emphasized text</em></p>
    </body>
</html>

Conclusion

In this HTML Tutorial, we learned about HTML <em> tag and went through different examples that cover defining an HTML Emphasised element, and styling it.