nu-validator报错“Bad value ‘width=100’”是因为它仅校验style属性字符串的语法合法性，不解析CSS语义，故不提示改为“width:100px;”；实操需手动修正语法并注意单位、冒号与分号。
为什么 style="width=100" 会报错但没提示修复方向
nu-validator 报 Bad value “width=100” for attribute “style”，本质是把整个字符串当作文本值校验，而非解析 CSS 声明。它只检查语法合法性（比如是否含非法字符），不理解 width=100 实际想表达的是 CSS 属性赋值错误。所以不会建议你改成 width:100px;——那是语义层面的修复，需要上下文理解。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 遇到这类报错，先用浏览器开发者工具选中对应元素，在 Styles 面板里看右侧是否显示“invalid property value”，确认是不是 CSS 解析失败
- 手动将
style="width=100"改为style="width:100px;"或style="width:100%;"，注意冒号、分号和单位缺一不可 - 若属性值来自模板拼接（如
style="width={{val}}"），需确保后端/变量渲染时已补全语法结构，不能只传100
alt 属性该留空、删掉还是写描述，AI 能判断但验证器不能
W3C 验证器强制要求 <img alt="HTML异常属性清理诊断方法" > 有 alt，但不区分语义：装饰图应设 alt=""，内容图必须写有效描述，而 alt="logo" 或 alt="image" 属于无效描述。AI 可结合位置（如在 <header></header> 里）、周围文本、src 后缀（logo.svg）推断意图；验证器只会统一报错“missing required attribute alt”。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 不要为绕过验证器而硬填无意义值；
alt=""是合法且推荐的装饰图写法 - 若图片承载关键信息（如图表、产品图），
alt必须准确传达其内容，而非仅说明“这是一张图” - 对 SVG 图标，优先用
<svg></svg>+<title></title>替代<img alt="HTML异常属性清理诊断方法" >，可兼顾可访问性与语义控制
动态生成的 HTML 容易漏掉属性校验，innerHTML 不会触发验证器检查
W3C 验证器只校验静态 HTML 字符串，对 JS 注入的 DOM（如 el.innerHTML = '<img src="x" alt="HTML异常属性清理诊断方法" >'）完全无感知。此时即使缺失 alt、拼错 class、或写成 onclick=alert(1)，验证器都报不出错——但浏览器控制台可能静默忽略，或引发 XSS 风险。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 所有 JS 拼接的 HTML 片段，应在插入前用
DOMPurify.sanitize()过滤，它能自动补alt占位、剥离on*事件、标准化引号 - 避免直接拼接属性值；改用
el.setAttribute('src', url)或el.alt = text，由浏览器做基础校验 - 对服务端返回的 HTML 片段（如富文本编辑器内容），必须在渲染前走一遍服务端清理流程，不能依赖前端补救
自闭合标签写法差异导致验证器误报，<img alt="HTML异常属性清理诊断方法" > 和 <img alt="HTML异常属性清理诊断方法" > 都合法但语境不同
HTML5 允许 <img src="x" alt="HTML异常属性清理诊断方法" >（无斜杠），XHTML 要求 <img src="x" alt="HTML异常属性清理诊断方法" >。nu-validator 默认按 HTML5 解析，所以把 <img src="x" alt="HTML异常属性清理诊断方法" > 当作冗余斜杠不报错；但某些 AI 工具会误判为“XHTML 风格混入 HTML5”，建议改成无斜杠写法——这其实是过度修正。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 项目统一用 HTML5 规范，所有自闭合标签写成
<img src="x" alt="HTML异常属性清理诊断方法" >、<input type="text">，不加斜杠 - 若团队已有 XHTML 习惯或需兼容旧系统，保持
/>写法即可，W3C 验证器不会因此报错 - 真正危险的是写成
<img src="x" alt="HTML异常属性清理诊断方法" >——这是非法嵌套，验证器会明确报错“Elementimgmust not have an end tag”
属性清理不是格式对齐游戏，而是语义落地过程。最容易被忽略的是：验证器只管“有没有”，AI 尝试猜“该是什么”，但最终决定权在人——比如 alt="" 是否真代表装饰性，得看设计稿和交互逻辑，而不是看验证器绿了就认为万事大吉。
