font Specifying a Text Font

Specifying a Text Font

Using the  element, you can you select text size, color , and face. However, this element was deprecated in HTML 4.0, so it's not available in XHTML 1.1 or XHTML 1.0 Strict. It's supported in XHTML 1.0 Transitional and XHTML 1.0 Frameset. Here are this element's attributes:

class Gives the style class of the element. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
color Deprecated. Sets the color of the text. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
dir Sets the direction of text that doesn't have an inherent direction in which you should read it, called directionally neutral text. You can set this attribute to LTR , for left-to-right text, or RTL , for right-to-left text. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
face Deprecated (you're supposed to use styles instead now). You can set this attribute to a single font name or a list of names separated by commas. The browser will select the first font face from the list that it can find. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
id Refers to the element; set this attribute to a unique identifier. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
lang Specifies the base language used in the element. Applies only when the document is interpreted as HTML. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
size Deprecated (you're supposed to use styles instead now). Sets the size of the text. Possible values range from 1 through 7 . (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
style Set to an inline style to specify how the browser should display the element. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
title Contains the title of the element (which might be displayed in ToolTips). (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)
xml:lang Specifies the base language for the element when the document is interpreted as an XML document. (XHTML 1.0 Transitional, XHTML 1.0 Frameset.)

This element does not support any XHTML events.

The  element has always been very popular among HTML authors, but with the new emphasis on handling styles in stylesheets, you can imagine that it was headed for extinction . And it has indeed been deprecated in HTML 4.0, which means you'll find it only in the XHTML 1.0 Transitional and Frameset DTDs. Because it's so popular still, I'll cover it here briefly .

You can use the  element to set a font face, size, and color for text. Here's an example; in this case, I'm displaying text in a large red Arial font:

Listing ch16_09.html

 <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">     <head>         <title>             Using the &lt;font&gt; Element         </title>     </head>     <body>         <font size="6" color="#ff0000" face="Arial">         Putting the &lt;font&gt; element to work.         </font>     </body> </html>

The results of this XHTML appear in Figure 16-7.

Figure 16-7. Using the element in Netscape Navigator.

graphics/16fig07.gif

You specify font sizes by using the values 1 through 7 . In practice, font size 1 is about 6 points, font size 2 is about 12 points, and so on, but actual sizes vary by system. Here's an example showing the range of possible sizes:

Listing ch16_10.html

 <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">     <head>         <title>             Using the &lt;font&gt; Element         </title>     </head>     <body>         <center>             <h1>                 Using the &lt;font&gt; Element             </h1>             <font size="1">This is font size 1.</font>             <br />             <font size="2">This is font size 2.</font>             <br />             <font size="3">This is font size 3.</font>             <br />             <font size="4">This is font size 4.</font>             <br />             <font size="5">This is font size 5.</font>             <br />             <font size="6">This is font size 6.</font>             <br />             <font size="7">This is font size 7.</font>         </center>     </body> </html>

The results of this XHTML appear in Figure 16-8. Note that  has been deprecated in HTML 4.0 in favor of stylesheets. So how should you replace the  element? See the topic "  Formatting Text Inline" at the end of this chapter for a good substitute.

Figure 16-8. Displaying various fonts sizes in Netscape Navigator.

graphics/16fig08.gif

Besides the simple text-formatting elements, HTML contains elements to arrange text in the display; XHTML supports those elements as well.