HTML (HyperText Markup Language) is the foundational language of the web, used to structure content on websites. At its core are "tags" and "elements," which work together to define how content is organized and displayed. In this chapter, we’ll explore HTML tags and elements, their structure, and how they build web pages.
What is HTML Tag?
An HTML tag is a core command used to define webpage elements.
Tags are enclosed in angle brackets (< >
).
Most of the HTML tags come in pairs called paired/double tags.
Some tags come without the closing tag called self-closing/single tags.
✅ Paired/Double tags:
Paired/Double tags have both an opening and a closing tag, with content placed between them. They are used for elements that contain text, images, or other nested elements.
Syntax:
<start tagname>
Some Content Here</end tagname>
Example:
<p>
My first Paragraph.</p>
Example explained:
<p> is the (paragraph tag) start/opening tag.
"My first Paragraph" is the content of the Paragraph element.
</p> is the end/closing tag.
Note:
Always include the end/closing tag. Skipping it can cause unexpected behavior, as the browser might misinterpret the document structure. This can affect how your content is displayed on the page.
✅ Self-closing/Single tags:
Single tags are self-contained and do not require a closing tag. They often represent elements that don’t contain any content or are used to insert standalone items, like images or line breaks.
Syntax:
<tagname />
Example:
<br/>,
<hr/>,
<img/>,
<link/>, etc.
What is HTML Element?
An HTML element is a fundamental building block of an HTML document used to build webpages.
It consists of a start tag, content, and an end tag.
Elements can represent various types of content, such as text, images, links, and other multimedia.
Syntax:
<tagname>
Some content here</tagname>
Example:
<p>Hello web Developers!
</p>
So, an HTML element is everything from the start of the opening tag to the end of the closing tag.
Notes:
Empty elements: The elements created using self-closing tags are called empty elements because these elements have no content.