Web design Dorset from Websites by Mark

HTML tag EM – Websites by Mark

01305 881027 / 01993 820005

HTML tag EM

Overview

The <em> HTML tag is known as a phrase tag, it is mainly used to style text. By default it makes text italic to emphasize the look of the tagged text. It works equally as well in table based layouts as well as CSS based ones. As with all phrase based HTML tags it can be used in situations where consistency between browsers is difficult to achieve in other ways. When text is put between the opening and closing <em> tag it is displayed as a emphasize text.

Basic HTML EM Usage

<em>Some emphasize text in here</em>

Any text between the opening and closing tag will be displayed as a emphasize text.

Advance HTML EM Usage

It is possible to style and add functionality to the <em> tag, this is done by adding an attribute to after the p in the opening <em> tag

Attributes allowed for the <em>tag include:-classdirid, langstyle and title.

In most cases class and id are used and its basic usage is shown below

<em id=”name-of-id”>some emphasize text</em>

With all attributes there is a space after the initial p then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.

Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.

With id this usually refers to a single instance on a page whereas class usually refers to a repeating element on a page, it is for this reason for the <em> tag may use either the id or class as an attribute.

The attribute style allows you to include CSS style information for a single <em> tag.

The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.

It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in JavaScript and therefore outside the scope of this document

Examples of EM in action

<em>Some emphasize text</em> – basic usage example.

<em id=”name-of-id”>some emphasize text</em> – emphasize text which is styled by the id name-of-id.

<em class=”name-of-class”> some emphasize text </em> – emphasize text which is styled by the class name-of-class.

<em id =”name-of-id” class=”name-of-class”> some emphasize text </em> – emphasize text which is styled by the class name-of-class and the id name-of-id.

<em style=”color:#F00;”>Some emphasize text</em> – emphasize text which has a custom colour of red.

<em dir=”rtl”>some emphasize text</em> – emphasize text where the text reads from right to left.

<em lang=”uk”>Some emphasize text</em> – emphasize text where the language has been tagged as UK.

<em title=”name-of-title”>some emphasize text</em> – emphasize text where the EM tag has been titled name-of-title.

Changes between HTML4 and HTML5

Technically in HTML4 webpages EM means emphasis (with STRONG having the meaning strong emphasis) in HTML5 EM is now considered to be a stress emphasis or in plain English a way to show the text has a different meaning to STRONG.