标签在 HTML5 中已被完全移除,其 color、size、face 属性被浏览器忽略,仅在怪异模式下可能偶然生效;应改用 等语义化标签配合 CSS 样式实现兼容与可维护性。

font 标签在现代 HTML 中根本不能用
不是“不推荐”,而是 HTML5 标准中已移除 标签的全部样式属性(color、size、face)。浏览器在 下解析时,会忽略这些属性,文字仍按默认样式渲染。你看到的“偶尔生效”,大概率是浏览器在怪异模式(quirks mode)下兼容旧行为,或 CSS 层叠意外覆盖了默认值——不可依赖。
常见错误现象和实际表现
把 错误提示 写进页面后:
- 文字仍是黑色,控制台出现警告:
The element is obsolete. Use CSS instead. -
size="4"不改变字号,face="Microsoft YaHei"不切换字体 - 即使临时显示正确,也无法响应暗色模式、无法被
:hover修改、不能继承父级font-size缩放 - 用屏幕阅读器访问时,该标签完全不传递语义,“红色”不等于“错误”,只是视觉巧合
替代方案:用 style 属性快速迁移
如果你正在维护旧代码或需要最小改动上线,直接替换 为带 style 的通用标签(如 或语义化标签),是最稳妥的过渡方式:
<!-- 旧写法(失效) --> <font color="#ff6b6b" size="4">青蓝色文字</font> <p><!-- 新写法(100% 兼容) --> <span style="color: #ff6b6b; font-size: 16px;">青蓝色文字</span></p>
注意:font-size 单位优先用 px 或 rem,避免用 size 数字(1–7)这种无意义的缩放等级;color 值写法不变,但载体必须是 CSS 属性。
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件(幻灯片风格)。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本,并且希望生成演示用的 HTML 时触发。支持任意内容来源:iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区,并通过企微直接发送给用户。触发词示例:帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
真正该做的:按语义选标签 + 外部 CSS 控制
长期来看,硬编码样式到 HTML 是技术债。应该:
- 用
表达强调,表达语气,表达时间——让结构本身有意义 - 给不同语义内容加 class,比如
或 - 在外部 CSS 或
块里统一定义:.error-text { color: #d32f2f; font-weight: 500; } - 避免用
font简写属性(如font: bold 16px/1.4 sans-serif),它容易因漏写font-size或font-family导致整条声明失效
最常被忽略的一点:哪怕只改一处颜色,也别再碰 。它不是“还能用”,而是“正在悄悄破坏可访问性和维护性”。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










