HTML <font> 标签 详解
HTML基础 2022-06-02 09:40:24小码哥的IT人生shichen
HTML <font> 标签
HTML5 中不支持
<font> 标签在 HTML 4 中用于指定字体、字体大小和文本颜色。
定义和用法
<font> 规定文本的字体、字体尺寸、字体颜色。
实例
规定文本字体、大小和颜色：
<font size="3" color="red">This is some text!</font>
<font size="2" color="blue">This is some text!</font>
<font face="verdana" color="green">This is some text!</font>
完整实例【亲自试一试】：
<html>
<body>
<h1><font face="verdana">A heading</font></h1>
<p><font size="5" face="arial" color="red">A paragraph.</font></p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
浏览器支持
| 元素 | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| <font> | Yes | Yes | Yes | Yes | Yes |
所有主流浏览器都支持 <font> 标签。
HTML 与 XHTML 之间的差异
在 HTML 4.01 中，font 元素不被赞成使用。
在 XHTML 1.0 Strict DTD 中，font 元素不被支持。
提示和注释：
提示：请使用样式（代替 <font>）来定义文本的字体、字体颜色、字体尺寸。
可选的属性
| 属性 | 值 | 描述 |
|---|---|---|
| color |
|
不赞成使用。请使用样式取代它。 规定文本的颜色。 |
| face | font_family |
不赞成使用。请使用样式取代它。 规定文本的字体。 |
| size | number |
不赞成使用。请使用样式取代它。 规定文本的大小。 |
TIY 实例
完整实例【设置文字的字体】：
<html>
<body>
<h1 style="font-family:verdana">A heading</h1>
<p style="font-family:courier">A paragraph</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
本例演示如何设置文字的字体。
完整实例【设置文字的尺寸】：
<html>
<body>
<h1 style="font-size:150%">A heading</h1>
<p style="font-size:80%">A paragraph</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
本例演示如何设置文字的尺寸。
完整实例【设置文字的颜色】：
<html>
<body>
<h1 style="color:blue">A heading</h1>
<p style="color:red">A paragraph</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
本例演示如何设置文字的颜色。
完整实例【设置文字的字体、字体尺寸、字体颜色】：
<html>
<body>
<p style="font-family:verdana;font-size:80%;color:green">
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>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
本例演示如何设置文字的字体、字体尺寸、字体颜色.
