HTML学习攻略：选对教程事半功倍

• 完成它的“Build a Tribute Page”项目后，你会本能地意识到：
  不是装饰，而是 document.querySelector('main') 的可靠锚点
• 写完“Survey Form”后，会记得
  和

  是表单可访问性的基础，不是为了好看
• 它的测试用例强制你检查 required、type="email" 是否真被浏览器原生校验触发，而不是只靠 JS 提示

避开“HTML 全标签手册”类教程的陷阱

有些资源罗列全部 120+ 个 HTML5 标签，包括早已废弃的 、实验性的 （Chrome 125+ 才刚进 Origin Trial）。结果是你花了两小时记 和 ，却在真实项目里一次都没用过——因为中文排版几乎不用 Ruby 注音，而团队也没人要求你适配日文阅读习惯。

真正高频且易错的其实是这几类：

• 的 loading="lazy" 在 Safari 15.6+ 才稳定，旧版本需降级为 JS 懒加载
• 在 iOS 上无法通过 valueAsDate 设置初始值，得用字符串格式
• 必须手动调用 showModal()，仅加 open 属性不会触发模态行为

最后提醒一句：别等“学完 HTML”再碰 CSS 或 JS

HTML 的语义价值只有在和 CSS 的 display: contents、JS 的 element.closest() 配合时才真正显现。比如你写了个