html注释需严格使用语法，避免嵌套、符号错误及混用js/css注释；应独占一行、缩进一致、配对标注区块边界，并用todo/fixme等明确标记意图，而非替代语义化结构。
HTML注释本身不改变页面行为，但写错位置、嵌套或混用符号会导致解析失败，甚至让整段后续 HTML 被浏览器误判为注释内容。
注释语法必须严格匹配 <!-- 和 -->
浏览器只认这一对标记，任何偏差都会中断解析。常见错误包括：
- 漏掉末尾的
-->，导致后面所有 HTML 都不渲染（页面空白或结构错乱） - 在注释内出现
--或>，比如写成<!-- 临时禁用 -- 新逻辑 -->，浏览器会在第一个--后就提前闭合，余下内容暴露为明文 - 误用
//或/* */，这些是 JS/CSS 的注释，在 HTML 中会被当作普通文本显示在页面上
多行注释要单独成行且缩进一致
把注释和标签挤在同一行会破坏结构可读性，尤其在嵌套较深时容易看错层级。正确做法是：
- 注释独占一行，前后都换行
- 与所标注代码保持相同缩进，例如
<main></main>缩进 2 空格，注释也缩进 2 空格 - 起始和结束注释配对使用，如
<!-- Header Start -->和<!-- Header End -->，方便搜索定位 - 避免写成
<!--<div class="card">-->这类“包裹式”写法，它既难读又容易因缩进不一致引发协作混乱
用 TODO、FIXME 等标记代替模糊描述
“待优化”“这里有问题”这类注释没有操作指向性。实际开发中应明确标注意图：
-
<!-- TODO: 替换为 fetch API 调用 -->—— 指出下一步动作和工具 -
<!-- FIXME: Safari 下 flex gap 不生效，降级为 margin -->—— 说明问题现象与临时方案 -
<!-- NOTE: 此处依赖后端返回的 data-status 字段 -->—— 提示关键外部依赖 - 上线前建议全局搜索
TODO，避免遗漏；但不要全删——有些FIXME是线上已知限制，需留作监控依据
结构注释要覆盖区块边界，而非单个标签
给 <div> 单独加注释意义有限，真正有用的是圈出语义区块。比如：<ul>
<li>用 <code><!-- Navigation Bar --> 包住整个 <nav></nav> 及其子元素，而不是只注释 <nav></nav> 开头
<!-- Product Carousel: auto-rotates every 5s, paused on hover -->
<!-- DEBUG: user_id=12345 -->），可能意外泄露到生产环境源码中最常被忽略的一点：注释不是替代清晰结构的手段。一个靠大量注释才能看懂的 HTML 片段，往往意味着语义标签没用好、class 命名不一致，或逻辑本该抽离到 JS/CSS 中。注释是补丁，不是底座。
