HTML – Fonts

Font Tag in HTML is one of the most important attributes used to make webpage or HTML documents more attractive.

This tag mainly works on three major attributes like size, Face or Type and color. Font tag works as an inline element in HTML to change some features of block text in HTML documents.

HTML <font> tag used within the <body> tag. It’s define using <font>your text here</font> tag in HTML.

Warning! This font tag is deprecated in HTML5. Don’t use it. You can use use CSS property of font.

<font size=” ” face=” ” color=” ”>

Font Face

This font face attribute is used to define the font type for included text.

<body>
   
<font face = "Comic sans MS">This is Comic Sans Font</font><br/>
   <font face = "Bernard MT Condensed" >This is Bernard MT Condensed Font</font><br/>
   <font face = "Algerian">This is Algerian Font</font><br/>

   <font face = "Book Antiqua">This is Book Antiqua Font</font><br/>
   <font face = "Aharoni">This is Aharoni Font</font>
</body>

Font Size

This font face attribute is used to define the font type for included text.

<body>
   <font face = "Comic sans MS" size="1">This is Comic Sans Font</font><br/>
   <font face = "Bernard MT Condensed" size="2">This is Bernard MT Condensed Font</font><br/>

   <font face = "Algerian" size="3">This is Algerian Font</font><br/>
   <font face = "Book Antiqua" size="4">This is Book Antiqua Font</font><br/>
   <font face = "Aharoni" size="5">This is Aharoni Font</font>
</body>

Font Color

This font face attribute is used to define the font type for included text.

<body>
   <font face = "Comic sans MS" size="1" color="#000">This is Comic Sans Font</font><br/>
   <font face = "Bernard MT Condensed" size="2" color="#cc0066">This is Bernard MT Condensed Font</font><br/>
   <font face = "Algerian" size="3" color="#cc3300">This is Algerian Font</font><br/>
   <font face = "Book Antiqua" size="4">This is Book Antiqua Font</font><br/>
   <font face = "Aharoni" size="5" color="#666600">This is Aharoni Font</font>
</body>

Changing Font Style Using the Inline-Style

We can also change font properties by using inline-style attribute. Following example shows you how to change font style, font color and it’s size using inline-style attribute.

<body>

<div style="font-family: Algerian; font-size: 18px; color: #cc3300;">This is Algerian Font</div>
</body>

Supporting Browsers

ElementChromeIEFirefoxOperaSafari
<font>YesYesYesYesYes