This document discusses HTML text formatting tags. It provides examples of common text formatting tags like <b> for bold, <i> for italics, and <u> for underline. It also covers font tags like <font> for changing font attributes like size, type, and color. The document is intended to teach a class on HTML text formatting tags and previews that the next class will cover image, link, and list tags.

1. COMPUTER APPLICATIONS
CLASS X (Code 165)
TOPIC:
UNIT 2: Text Formatting Tags
By
HIMANSHU PATHAK

2. Contents
• Introduction
• Text Formatting Tags
• Font Tags

3. Introduction
• HTML provides us with the ability for formatting
text just like we do it in MS Word or any text
editing software.
• It gives us the ability to format the text without
using CSS.
• The following HTML tags are used to format the
appearance of the text on your web page.

4. Bold : <b> </b>
• The <b> tag is used to make a word or group of
the word special to draw the reader's attention.
• However, you should not use the b tag to make
text bold instead use the font-weight property of
CSS.
• Example:
– <p>b tag is used to make <b>special words</b>
bold.</p>
• Strong Emphasis - <strong> </strong>Used to
emphasize text more, which usually appears in
bold, but can vary according to your browser.

5. Italic : <i> </i>
• It works as the same way as a word processor,
italics displays the text at a slight angle.
• It makes text italic and is used to define
technical terms, idiomatic text, etc.
• Example:
– <p>HTML is a <i>markup language</i>.</p>
• Emphasis - <em> </em> Used to emphasize
text, which usually appears in italics, but can
vary according to your browser.

6. Underline: <u> </u>
• The <u> tag is used to represent a non-literary
explanation.
• Again, the same as underline in a word
processor.
• Note that html links are already underlined
and don't need the extra tag.
• Example:
– p>There are lots of <u>speling</u> mistake in
<u>thes</u> line.</p>

7. Strike-out: <strike> </strike>
• Puts a line right through the centre of the text,
crossing it out.
• Often used to show that text is old and no
longer relevant.
• Also works by using <s> </s> instead.
• The <del> tag defines texts which have been
remove from the document or webpage.
• Example:
– <p><s>Use &lt;center&gt; tag to ceter a text in
HTML.</s></p>

8. Preformatted Text: <pre> </pre>
• It is used to present text as it is written in an
HTML document.
• The whitespaces used in the element are
displayed the same as written.
• Example:
– <pre>Y Y
Y Y
Y Y
Y
Y
</pre>

9. Superscript: 
• The <sup> tag is used to display text as
superscript.
• Superscript is rendered with a raised baseline
and smaller text.
• This tag are broadly used in Mathematics.
• Example:
– <p> Area of a Circle is: Pi * radius ²
</p>

10. Subscript: 
• The <sub> tag is used to display text as a
subscript.
• Subscript is rendered as small text with a
lower baseline.
• This tag is broadly used in Chemistry.
• Example:
– <p>Molecular formula of water is
H₂O</p>

11. Small: <small> </small>
• The <small> tag is used to define smaller text
like copyright, comments, etc.
• By default, it renders text smaller than
standard however it can be controlled using
CSS.
• Example:
– <p>The &lt;small&gt; tag is used to make text
<small>smaller</small>.</p>

12. Abbreviation: <abbr> </abbr>
• The <abbr> tag is used to represent an
abbreviation or acronym.
• The tag accepts a title attribute that accepts the
full form of the word.
• When the reader hovers the text it shows a full
description of the word.
• Example:
– <p><abbr title="Hypertext markup
language">HTML</abbr> is used to create
webpages.</p>

13. Mark: <mark> </mark>
• The <mark> tag marks or highlights a text to
grab reader's attention.
• Example:
– <p>mark tag is used to <mark>highlight</mark> a
text.</p>

14. Meter: <meter> </meter>
• The <meter> tag is used to define a scale with a given range
and value.
• The tag requires a defined value with min value and max value
of the scale.
• The min, max and the value are attributes of the tag.
• You can also give low and high values to the scale which is used
to change the color of the scale.
• If the value of the scale is below the low value then the scale is
green, if the value is between low and high then the scale is
yellow and if the scale is above the high value then the scale is
red.
• Example:
– <p>Speed of bike was 65kmph <meter min="0" max="100"
low="33" high="66" value="65"></meter></p>

15. Quotation: <q> </q>
• The <q> tag defines an inline quotation.
• The most modern browser automatically adds
quotation marks around the text.
• Example:
– <p> Modi is our <q>prime minister</q></p>

16. Font Tags
• The <font> tag plays an important role in the web
page to create an attractive and readable web page.
• The font tag is used to change the color, size, and
style of a text.
• Now, it is not supported by HTML 5.
• The font tag has basically three attributes which are
given below:
– Size
– Face/Type
– Color

17. Font Size
• This attribute is used to adjust the size of the
text in the HTML document using font tag with
size attribute.
• The range of size of the font in HTML is from 1
to 7 and the default size is 3.
• Example:
– <font size = "3">Welcome to!</font><br />
– <font size = "4">Pathak’s Computer </font><br />
– <font size = "5">Online-classes!</font><br />

18. Font Type
• Font type can be set by using face attribute with
font tag in HTML document.
• The fonts used by the user need to be installed in
the system first.
• To show text in a particular font, use the font
name such "Helvetica" or "Arial" or "Courier".
• Example:
– <font face = "Verdana" size = "6"> Pathak’s Computer
Academy!!</font><br />

19. Font Color
• Font color is used to set the text color using font
tag with the color attribute in HTML document.
• Color can be specified either with its name or
with Its hex code or with RGB value.
• Example:
– <font color = "#009900">Himanshu</font><br />
– <font color = "green">Pathak</font>

20. Today we learn
• Learned basic Text Formatting Tags
• Font Tags and their attributes
• In the next class, we will start Unit II – Image,
Links & Lists Tags in detail.
•Thanks