<font>
HTML <font> Tag
The <font> tag defines the font characteristics. Size, color and typeface are defined by the size, color and face attributes.
The <font> tag is a deprecated HTML tag. Instead of it, use CSS styles (see an example below).
Syntax
Syntax （语法）
The <font> tag comes in pairs. The content is written between the opening (<font>) and closing (</font>) tags.
Example of using HTML <font> tag:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>
<font size="2" color="#1c87c9">Blue text</font>
</p>
<p>
<font size="3" color="red">Red text, font size increased.</font>
</p>
<p>
<font face="arial" color="#8ebf42">Green text, typeface changed.</font>
</p>
</body>
</html>
Result
CSS Styles
CSS Styles （CSS样式）
To change the text color, use the CSS color property instead of the color attribute. CSS font-family or font-face properties replace the face attribute, and instead of the size attribute, the CSS font-size property is used. （要更改文本颜色，请使用CSS颜色属性而不是颜色属性。CSS font-family或font-face属性替换face属性，并使用CSS font-size属性代替size属性。）
Example of changing the style of the text with CSS:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p style="font-size:16px; color:#1c87c9;">Blue text.</p>
<p style="font-size:18px; color:red;">Red text, font size increased.</p>
<p style="font-size:18px; color:#8ebf42; font-family:arial;">Green text, typeface changed.</p>
</body>
</html>
Attributes
Attributes （属性）
| Attribute | Value | Description |
|---|---|---|
| color | rgb (x, x, x)#xxxxxxcolorname | Sets the color of the text. |
| face | font_family | Sets the typeface. |
| size | number | Sets the size of the text. |
How to style <font> tag? Common properties to alter the visual weight/emphasis/size of text in <font> tag:
CSS font-style property sets the style of the font. normal | italic | oblique | initial | inherit. CSS font-family property specifies a prioritized list of one or more font family names and/or generic family names for the selected element. CSS font-size property sets the size of the font. CSS font-weight property defines whether the font should be bold or thick. CSS text-transform property controls text case and capitalization. CSS text-decoration property specifies the decoration added to text, and is a shorthand property for text-decoration-line, text-decoration-color, text-decoration-style.
Coloring text in <font> tag:
CSS color property describes the color of the text content and text decorations. CSS background-color property sets the background color of an element.
Text layout styles for <font> tag:
CSS text-indent property specifies the indentation of the first line in a text block. CSS text-overflow property specifies how overflowed content that is not displayed should be signalled to the user. CSS white-space property specifies how white-space inside an element is handled. CSS word-break property specifies where the lines should be broken.
Other properties worth looking at for <font> tag:
CSS text-shadow property adds shadow to text. CSS text-align-last property sets the alignment of the last line of the text. CSS line-height property specifies the height of a line. CSS letter-spacing property defines the spaces between letters/characters in a text. CSS word-spacing property sets the spacing between words.