1.
Text Elements
HTML provides various elements to
structure and format text on a webpage.
Some of the most common text elements
include headings, paragraphs, line
breaks, and horizontal rules.
a. Headings (<h1> to <h6>)
Headings are used to create titles and
subtitles on a webpage. HTML offers six
levels of headings, from <h1> (the
highest or most important level) to <h6>
(the lowest level).
• Example:
b. Paragraphs (<p>)
Paragraphs are used to group sentences
and other elements together in a block of
text. They are the basic building blocks of
text content.
• Example:
c. Line Breaks (<br>)
A line break is used to insert a new line
within text without starting a new
paragraph. This tag is an empty element
and does not have a closing tag.
• Example:
d. Horizontal Rules (<hr>)
A horizontal rule is used to insert a
thematic break or division between
sections of content. It creates a
horizontal line across the page.
• Example:
2. Text Formatting Tags
HTML provides various tags to apply
different styles to text, such as bold,
italic, and underline.
a. Bold Text (<b>, <strong>)
Bold text is used to emphasize or highlight
certain words or phrases. Both <b> and
<strong> tags are used for bolding text,
but <strong> also indicates that the text
is of greater importance.
• Example:
b. Italic Text (<i>, <em>)
Italic text is used for emphasis or to denote
titles of works like books and films. Both
<i> and <em> tags italicize text, but <em>
also conveys importance or stress.
• Example:
c. Underlined Text (<u>)
Underlined text is used to draw attention to
specific content, though it’s less common
on the web today due to its association
with hyperlinks.
• Example:
3. Inline vs. Block Elements
HTML elements can be classified as either
inline or block elements, depending on
how they affect the layout of a webpage.
a. Block Elements
Block elements take up the full width
available (by default) and always start on
a new line. They typically contain other
block or inline elements.
• Examples of Block Elements:
o <div>: A generic container for block-level
content.
o <p>: Paragraphs of text.
o <h1> to <h6>: Headings.
• Example:
b. Inline Elements
Inline elements only take up as much width
as necessary and do not start on a new
line. They are typically used for smaller
pieces of content within block elements.
• Examples of Inline Elements:
o <span>: A generic container for inline
content.
o <a>: Hyperlinks.
o <b>, <i>, <u>: Text formatting tags.
• Example:
Understanding the difference between
inline and block elements is important for
properly structuring and styling content
in HTML.