应避免使用、、、、、、等废弃标签，因它们语义缺失、维护困难、与现代工程实践相悖；html5已将其定义为obsolete，仅因向后兼容被浏览器支持。
<font></font>、<center></center>、<u></u>、<s></s>、<strike></strike>、<big></big>、<basefont> 这些标签在现代 HTML 开发中应明确避免使用——它们不是“还能用”，而是语义缺失、维护困难、且与当前工程实践相悖。
为什么浏览器还支持这些标签，但你不能用
所有主流浏览器出于向后兼容仍解析这些标签，但这不等于推荐。它们被 HTML5 规范明确定义为“obsolete”，W3C 不再维护其语义定义，也不保证未来版本持续支持。
-
<font></font>和<basefont>把字体、大小、颜色全写死在结构层，CSS 无法可靠覆盖或继承，尤其在组件化场景下极易失控 -
<center></center>的居中行为依赖全局块级渲染逻辑，和 Flexbox/Grid 完全不兼容，响应式断点里会突然失效 -
<u></u>在 HTML4 中本意是“非文本标注”（如拼写错误），但被广泛误用于纯视觉下划线；HTML5 已将语义收归<ins></ins>（插入）或 CSStext-decoration: underline
替换时别只改标签，要重审语义意图
直接把 <u>重要提示</u> 换成 <span class="underline">重要提示</span> 是偷懒。先问：这行文字的“重要”是强调语气？还是法律条款中的必须阅读项？或是编辑标记的待修订内容？
- 强调语气 → 用
<strong></strong>或<em></em>，再配 CSS 控制视觉 - 法律/合同关键条目 → 用
<mark></mark>，它自带语义（高亮引用），屏幕阅读器会特殊播报 - 编辑痕迹（如修订稿）→ 用
<ins></ins>/<del></del>，而非靠 class 模拟
比如 <s>原价￥199</s> <strong>特价￥99</strong> 应改为 <del>原价￥199</del> <ins>特价￥99</ins> —— 语义清晰，无障碍支持自然跟上。
CSS 替代方案的关键细节
用 CSS 替代不是简单套个 class，要注意默认样式差异和可访问性影响：
-
<center></center>对齐的是其子元素的文本和行内内容，但对 block 元素无效；CSS 中应统一用text-align: center（文本）或display: flex; justify-content: center（容器） -
<big></big>并无标准字号映射，不同浏览器解释不一；改用font-size: 1.2em或font-size: clamp(1rem, 1.1vw, 1.3rem)更可控 - 给
<u></u>加下划线时，若用text-decoration: underline，记得加text-underline-offset: 2px避免贴底，否则小写字母 g/j/p 易被截断
遗留代码清理时最常踩的坑
批量替换时容易忽略上下文耦合：
- 某些老项目用
<font color="#ff0000"></font>标记错误提示，但 JS 逻辑里写了el.querySelector('font[color]')来捕获；换 CSS 后这类选择器必须同步更新 -
<strike></strike>常被用作“已停用功能”的视觉标识，但换成<del></del>后，若没补aria-hidden="true"或配套 CSSdel[aria-hidden="true"] { text-decoration: none; }，可能意外暴露给读屏软件 - 用
<center></center>包裹整个表单的老代码，直接删标签会导致子元素左对齐塌缩；需检查父容器是否已有text-align或margin: auto等隐式居中逻辑
真正难的从来不是“怎么替”，而是“替完之后，哪些地方悄悄坏了”。每次删除一个废弃标签，都该连带检查 JS 选择器、CSS 继承链、以及至少一种屏幕阅读器的实际播报效果。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
