Text
There are a variety of HTML elements used to convey the meaning of words, phrases or blocks of text in your web content. To date, you’ve been introduced to a few of them:
- headings (e.g.,
h1
,h2
) - the paragraph element (
p
) - the anchor element (
a
), more commonly known as a link - the
strong
element
Like you learned with HTML headings, it’s important to think of the meaning of an HTML element separate from what it may look like in the browser. By default, the em
and i
elements are displayed as italicized text and the strong
and b
elements appear as bold text – but that does not provide any clue into the meaning/purpose of these elements and those stylistic choices can be overridden by CSS.
Before using any of these elements, you should first consider why you are drawing attention to this word or phrase:
- to identify technical terms or foreign phrases, use
i
- to identify a keyword or product name, use
b
- to convey emphasis (“Do not open that door!”), use
em
- to convey importance or urgency, use
strong
If a word or phrase does not have one of these meanings or purposes and you just want it to be in bold or italics for aesthetic reasons, you should not use any of these elements to achieve that. Instead, you’ll use CSS to change the styling (more on this later).
Learn more
If you want more context or examples for the HTML elements you’ve learned so far, check out the following links:
-
h1
-h6
Following and reading this link is optional.✳️ -
p
Following and reading this link is optional.✳️ -
a
Following and reading this link is optional.✳️ -
strong
Following and reading this link is optional.✳️ -
em
Following and reading this link is optional.✳️ -
b
Following and reading this link is optional.✳️ -
i
Following and reading this link is optional.✳️