HTML Fonts
The <font> tag in HTML is deprecated. It is supposed to
be removed in a future version of HTML.
Even if a lot of people are using it, you should try to avoid
it, and use styles instead.
The HTML <font> Tag
With HTML code like this, you can specify both the size and the type of the
browser output :
Example
<p>
<font size="2" face="Verdana">
This is a paragraph.
</font>
</p>
<p>
<font size="3" face="Times">
This is another paragraph.
</font>
</p> |
Try it » |
Font Attributes
| Attribute |
Example |
Purpose |
| size="number" |
size="2" |
Defines the font size |
| size="+number" |
size="+1" |
Increases the font size |
| size="-number" |
size="-1" |
Decreases the font size |
| face="face-name" |
face="Times" |
Defines the font-name |
| color="color-value" |
color="#eeff00" |
Defines the font color |
| color="color-name" |
color="red" |
Defines the font color |
The <font> Tag Should NOT be Used
The <font> tag is deprecated in the latest versions of HTML (HTML 4 and
XHTML).
The World Wide Web Consortium (W3C) has removed the <font> tag from its
recommendations. In future versions of HTML, style sheets (CSS) will be used to
define the layout and display properties of HTML elements.
The Right Way to Do It - With Styles
Set the font of text
This example demonstrates how to set the font of a text.
HTML Code
<html>
<body>
<h1 style="font-family:verdana">A heading</h1>
<p style="font-family:courier">A paragraph</p>
</body>
</html>
Results
Set the font size of text
This example demonstrates how to set the font size of a text.
HTML Code
<html>
<body>
<h1 style="font-size:150%">A heading</h1>
<p style="font-size:80%">A paragraph</p>
</body>
</html>
Results
Set the font color of text
This example demonstrates how to set the color of a text.
HTML Code
<html>
<body>
<h1 style="color:blue">A heading</h1>
<p style="color:red">A paragraph</p>
</body>
</html>
Results
Set the font, font size, and
font color of text
This example demonstrates how to set the font, font size, and font color of a text.
HTML Code
html>
<body>
<p style="font-family:verdana;font-size:125%;color:Blue ">
This is a paragraph with some text in it. This is a paragraph with some text in it. This is a paragraph with some text in it. This is a paragraph with some text in it.
</p>
</body>
</html>
Results
This is a paragraph with some text in it. This is a paragraph with some text in it. This is a paragraph with some text in it. This is a paragraph with some text in it.
|
Where to Learn More About Style Sheets?
First off: Finish the last chapters in our HTML tutorial !!! In the
following chapters we will explain why some tags, like <font>, are to be
removed from the HTML recommendations, and how to insert a style sheet in an
HTML document.
To learn more about style sheets: Study our CSS Tutorial.
| 
