0% found this document useful (0 votes)
11 views

Experiment 4 HTML.docx (1)

Uploaded by

ankitbarnawal697
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
11 views

Experiment 4 HTML.docx (1)

Uploaded by

ankitbarnawal697
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Experiment 4

Program : Write a HTML program to display text using different formatting styles like bold text,
italic text, underlined text, strike text, monospaced font, superscript text, subscript text, inserted text,
deleted text, large text, smaller text, and grouping content

Theory:

1. <b> (Bold Text): This tag is used to make the enclosed text appear bold. Bold text is
typically used for emphasizing important words or sections of content, such as titles or
keywords.
2. <i> (Italic Text): This tag is used to make text italicized. Italics are often used for emphasis or
to indicate foreign words, thoughts, or technical terms in writing.
3. <u> (Underlined Text): This tag applies an underline to the text. Underlining is traditionally
used to highlight links in a webpage, although it can also be used for emphasizing specific
text in general content.
4. <s> (Strikethrough Text): The <s> tag is used to strike through text, typically to show that
something is outdated or no longer relevant. It is often used to indicate deleted content in
documents.
5. <code> (Monospaced Font): The <code> tag displays text in a monospaced font, often used
for displaying code snippets. This formatting keeps the spacing consistent and helps in
reading programming code or technical instructions.
6. <sup> (Superscript Text): The <sup> tag raises text above the normal line, commonly used
for writing mathematical expressions, chemical formulas, or footnotes (e.g., x² or H₂O).
7. <sub> (Subscript Text): The <sub> tag places text slightly below the normal line. It’s used for
chemical formulas, mathematical expressions, or footnotes (e.g., x₁or CO₂).
8. <ins> (Inserted Text): The <ins> tag is used to indicate text that has been inserted into the
document. The inserted text is usually underlined to highlight the change. It can be used to
show updated or added content in a revision.
9. <del> (Deleted Text): The <del> tag is used to strike through text, representing content that
has been deleted or removed. This is useful in showing revisions or deletions in a
document.
10. <big> (Large Text): The <big> tag makes text appear larger than the surrounding text,
typically used to highlight important or more significant text.
11. <small> (Smaller Text): The <small> tag reduces the text size, typically used to display less
important content, such as legal disclaimers or fine print.
12. Grouping Content with <strong> and <em>:
○ <strong>: This tag is used to emphasize text by making it bold. It is used to
highlight important information or sections.
○ <em>: This tag is used to emphasize text by italicizing it. It’s often used to highlight
words that should stand out in a sentence for emphasis.
Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Text Formatting Styles</title>
</head>
<body>

<h1>Text Formatting Styles</h1>

<!-- Bold Text -->


<p><b>This is bold text.</b></p>

<!-- Italic Text -->


<p><i>This is italic text.</i></p>

<!-- Underlined Text -->


<p><u>This is underlined text.</u></p>

<!-- Strikethrough Text -->


<p><s>This is strikethrough text.</s></p>

<!-- Monospaced Font -->


<p><code>This is monospaced text (using the code tag).</code></p>

<!-- Superscript Text -->


<p>This is normal text with <sup>superscript</sup> text.</p>

<!-- Subscript Text -->


<p>This is normal text with <sub>subscript</sub> text.</p>

<!-- Inserted Text -->


<p>This is normal text with <ins>inserted text</ins>.</p>

<!-- Deleted Text -->


<p>This is normal text with <del>deleted text</del>.</p>

<!-- Large Text -->


<p><big>This is large text.</big></p>

<!-- Smaller Text -->


<p><small>This is smaller text.</small></p>

<!-- Grouping Content -->


<p><strong>Bold and Important:</strong> This is some <em>italic and emphasized</em> content
grouped together.</p>

</body>
</html>

Code:
Output:

Result:

The HTML tags demonstrated in this program effectively display various text formatting styles. Each
style serves its specific purpose, whether for emphasizing content, indicating deletions or insertions,
or formatting technical text like code or chemical formulas. This approach enhances the readability
and accessibility of web content, allowing for better content organization and presentation.

You might also like