CSC 201

Introduction to HTML

Chapter 3 - Bold, Italics, Font and

other character formatting options

1
 Character Formatting
In this chapter you will learn how to enhance your page
with Bold, Italics, and other character formatting
options.
Objectives
Upon completing this section, you should be able to
1. Change the color and size of your text.
2. Use Common Character Formatting Elements.
3. Align your text.
4. Add special characters.
5. Use other character formatting elements.

2
 Bold, Italic, Font and other Character
Formatting Elements
• <B> Bold </B>
• <I> Italic </I>
• <U> Underline </U>

 The FONT tag is having three attributes called COLOR, SIZE

and FACE to customize your fonts.

 Color = “#RRGGBB” The COLOR attribute of the FONT

element. E.g., <FONT COLOR=“RRGGBB”>this text has
color</FONT>

3
 Bold, Italic, Font and other Character
Formatting Elements
 Size = “Number” The SIZE attribute of the FONT
element. E.g.,
<FONT SIZE = "1">Font size 1</FONT><br>
<FONT SIZE = "2">Font size 2</FONT><br>
<FONT SIZE = "3">Font size 3</FONT><br>
<FONT SIZE = "4">Font size 4</FONT><br>
<FONT SIZE = "5">Font size 5</FONT><br>

4
 Bold, Italic, Font and other Character
Formatting Elements
 Face = “Number” The SIZE attribute of the FONT
element. E.g.,

<FONT FACE = "Times New Roman" size = "5">Times New

Roman</FONT><BR />

<FONT FACE = "Verdana" size = "5">Verdana</FONT><BR />

<FONT FACE = "Comic sans MS" size =" 5">Comic Sans

MS</FONT><BR />

<FONT FACE = "WildWest" size = "5">WildWest</FONT><BR />

5
<FONT FACE = "Bedrock" size = "5">Bedrock</FONT><BR />
 Bold, Italic and other Character Formatting
Elements

 <STRONG> STRONG </STRONG> Browsers

display this as bold.

 <CITE> Citation </CITE> represents a

document citation (italics). For titles of books,
films, etc. Typically displayed in italics.

6
 Bold, Italic and other Character Formatting
Elements
<B> Bold</B> Bold
<BR> italics
<I> italics</I> Underlined
<BR> Colored
<U> Underlined </U> Strong
<BR> Citation
<FONT COLOR=“FF0000”>
Colored </FONT>
<BR>
<STRONG> Strong </STRONG>
<BR>
<CITE> Citation </CITE>

7
 Alignment
 Some elements have attributes for
alignment (ALIGN) e.g. Headings and
Paragraphs.

 The Three alignment values are : LEFT,

RIGHT, CENTER.

8
 Alignment

<h1 align=left>Haigazian University</h1>

<br>
<p align=center>Haigazian University</p>
<br>
<h1 align=right>Haigazian University</h1>

9
 Special Characters & Symbols
Special Entity Special Entity
Character Name Character Name
Ampersand &amp; & Greater-than &gt; >
sign
Asterisk &lowast; Less-than sign &lt; <
∗∗
Cent sign &cent; ¢ Non-breaking &nbsp;
space
Copyright &copy; © Quotation mark &quot; "
Fraction one &frac14; Registration &reg; ®
qtr ¼ mark
Fraction one &frac12; Trademark sign &trade; 10
half ½ ™
 Additional Character Formatting Elements

 <STRIKE> strike-through text</STRIKE>

DEL is used for STRIKE at the latest
browsers
 <BIG> places text in a big font</BIG>
 <SMALL> places text in a small
font</SMALL>
 <SUB> places text in subscript position </SUB>
 <SUP> places text in superscript style
position </SUP>
11
 Additional Character Formatting Elements

<STRIKE> strike-through text </STRIKE>

<BR><BR>
<BIG>places text in a big font </BIG>
<BR><BR>
<SMALL>places text in a small font</SMALL>
<BR><BR>
<SUB>subscript </SUB>
Normal
<SUP>superscript</SUP>

12