HTML and CSS Reference
Elements and Tags
Even though a web page we look at today may be full of text, pictures and videos, under-
neath that facade is a single long file full of HTML text. When we "ask" our browser for a
web page, the browser retrieves a document written in HTML, a language our browser can
understand and interpret. The text has "markings" that instruct the browser where things be-
gin, where they end, and what purpose they serve.
To prepare a document for the web, we need to go through the simple process of marking up
the text with a specific set of textual elements called tags. A tag is the basic building block
of a web page and is essentially a reserved word placed between the '<' and '>' characters.
For example, the element <html> represents a tag.
All tags in HTML come in pairs, meaning there is a tag that signals the beginning of the
element, also known as an opening tag , and a tag that signals the end the element called a
closing tag . The opening and the closing tags have the same name, with the only difference
being that the name of the closing tag is always preceded by the slash character '/'.
For example, the following HTML code:
Will be displayed on the page as:
When a web browser reads the HTML document and reaches the <strong> element, it
doesn't display the text <strong> on the web page. Instead, when the browser encounters a
tag, it interprets it as a command to display text in a specific, predefined way. In this ex-
ample, when encountering the <strong> tag the browser interprets that from that point on
the text is marked up as strong, more important text, and it displays that text in bold until it
reaches the closing tag </strong>.
Note: While marked up text has a default “look” in the browser, the actual visual
representation of HTML elements is controlled by a different set of rules called Cas-
cading Style Sheets (CSS).
To reiterate, in HTML-speak, an element refers to the opening tag, the closing tag, and any-
thing written between them. The content between the opening tag and the closing tag is re-
ferred to as element content . In the example above '<strong>Jung</strong>' is an element,
'Jung' is the element content, '<strong>' is the opening tag of the element, and '</strong>
is the closing tag of the element.