Inline Elements

Strong

Use strong to represent a shout or to exclaim. A strong word is a forceful word! Often it’s meant to point out an important string of text.

<p>Use strong to represent a <strong>shout</strong>or to <strong>exclaim</strong>. A <strong>strong</strong> word is a <strong>forceful</strong> word! Often it’s meant to point out <strong>an important string of text</strong>.</p>

Emphasis

Use emphasis when you want to accent or inflect on a word. I think they work great for rhetorical questions, don’t you?

<p>Use emphasis when you want to <em>accent</em> or <em>inflect</em> on a word. I think they work great for rhetorical questions, <em>don’t you?</em></p>

If the emphasis element contains a language other than the primary language of the document, then it’s a good practice to add the lang attribute to the element that designates the proper language. This goes for any HTML element, but is most frequntly seen with the <em> element as it’s often used to denote other languages in text.

<p>They say <em lang="fr">je ne sais quoi</em> is a thing one wouldn't know how to define but whose existence is understood intuitively.</p>

Delete

Use <del> to represent a deleted word.

<p>Use <del> to represent a <del>deleted</del> word.</p>

Insert

Use <ins> to represent deleted inserted text.

<p>Use <ins> to represent <del>deleted</del> <ins>inserted</ins> text.</p>

Inline elements are used within blocks of text to make changes to the text without changing the flow of the text.

Quote

Use <q> for inline quotes. You’ll notice that quotation marks are automatically added to the element.

Mark Twain once said: Kindness is a language which the deaf can hear and the blind can see..

<p>Mark Twain once said: <q>Kindness is a language which the deaf can hear and the blind can see.</q>.</p>

Code

This element marks text that refers to a programming language. These code examples make liberal use of the <code> element.

&hearts; is the HTML entity that displays the hearts symbol from a deck of cards.

<p><code>&amp;hearts;</code> is the HTML entity that displays the hearts symbol from a deck of cards.</p>

Span

A Span (<span>) element is considered an empty element. It is an element devoid of all styles. It’s usually used to group inline text that shares a common attribute, but doesn’t share other qualities, or, when text needs to be styled, but no other element makes semantic sense. Usually with CSS to apply additional styles or effects inline.

<p>Pablo Picasso is often quoted: <span id="pablo">Los ordenadores son <em>inútiles</em>. Solo pueden darnos <em>respuestas</em></span>.</p>