Important Tags (3)

Inline Tags

An inline tag, when rendered, has no line break before or after it.

<a> Defines a hyperlink, i.e., a link between two pages;
<em> (emphasis) By default, browsers render the content of this tag in italics, and it is used for something to be pronounced differently;
<strong> (strong importance) By default, browsers render the content of this tag in bold, and it is used to signify the importance of its content (see html5doctor);
<img src="path/to/image.jpg"> Tag that will display an image;
<button> A button.

TIP

By default, an inline cannot be given vertical dimension, nor vertical padding nor vertical margin.

There are some exception, though: the tag that have intrinsic dimensions, like <img> and button.

<video> for inserting video content;
<audio> for inserting audio content;
<figure> is a semantic container that groups multimedia content (image, graphic, photos, diagram, table, video, etc.) and is associated with a <figcaption> tag.

<div> and <span> are tags that do not provide any information about their content, so they are non-semantic.

The <div> tag has a default display of block (see CSS).

In contrast, the <span> tag has a default display of inline (see CSS), which means there will be no line break before or after the tag.

<i> (Initially italic) Browsers render the content of this tag in italic, and it is used for technical or translated words; screen readers are supposed to use an alternative voice for the content;
<b> (Initially bold) Browsers render the content of this tag in bold, and it is used for keywords.