HTML text-level semantics

Before HTML5, text-level semantic elements were referred to in the specifications as inline elements. Therefore, if you are familiar with that description, be aware that we are talking about the same thing here.

The section of the HTML specification that details text-level semantics can be found here: https://html.spec.whatwg.org/multipage/text-level-semantics.html#text-level-semantics.

Let’s take a look at the most common and useful text-level elements.

The <span> element

A span element is the text-level equivalent of a div. It is unopinionated and is the perfect element to reach for when you merely want to wrap text in an element for styling purposes.

The <b> element

Historically, visuals were defined in the markup and the b element meant “make this bold” (https://www.w3.org/TR/html4/present/graphics.html#edef-B). However, the specification now describes the b element like this:

The b element...