html的最小有效结构需包含、根元素、含的和；与应作为语义化标签的兜底选项；表单提交依赖name属性，js/css定位依赖id；本地双击打开受file://协议限制，须用本地服务器开发。
HTML 不是编程语言，不需要“入门教程”式的系统学习；它是一套标记规则，打开编辑器写几行就能看到效果。关键不是学完所有标签，而是知道哪些标签该在什么场景下用、浏览器怎么理解它们、以及如何避免常见误解。
从
很多初学者卡在第一行就报错，其实是漏了必需的骨架。浏览器渲染 HTML 时依赖明确的文档类型和根元素，否则可能触发怪异模式（quirks mode），导致样式错乱或 JS 行为异常。
必须放在第一行，且不能有任何字符（包括空格、BOM）前置-
是根元素，里面必须有和 -
至少要包含<meta charset="utf-8">，否则中文会乱码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>我的第一个页面</title> </head> <body> <p>Hello World</p> </body> </html>
<div> 和 <code><span></span> 到底什么时候该用
这两个标签本身没有任何语义，但滥用会导致可访问性（a11y）和 SEO 问题。现代 HTML 推荐优先使用语义化标签，<div> 和 <code><span></span> 只在“没有更合适标签”时兜底。
立即学习“前端免费学习笔记（深入）”；
<div> 是块级容器，适合组织大块内容区域，比如页眉、侧边栏、卡片容器 <li> <code><span></span>是内联容器，只用于局部样式或脚本控制，比如给一句话里的某个词加 class- 能用
<header></header>就别用<div class="header">；能用 <code><article></article>就别套三层<div> <h3>表单里 <code>name和id的区别经常被搞混提交数据靠
name，JS 或 CSS 定位靠id（或class）。如果表单提交后后端收不到字段，大概率是漏写了name属性。-
<input name="email">→ 提交时字段名为email，值才会进请求体 -
<input id="email-field">→ 只用于document.getElementById('email-field')或label[for="email-field"] -
<label for="email-field">邮箱</label>中的for必须匹配id，不是name
为什么本地双击打开 HTML 文件有时样式不生效
不是代码写错了，而是浏览器安全策略限制：当 URL 是
file://协议时，部分 CSS（如@import）、JS（如fetch）或字体文件会被拒绝加载，控制台报Blocked loading resource from cross-origin script类错误。- 开发阶段务必用本地服务器，哪怕只是
npx serve、python3 -m http.server或 VS Code Live Server 插件 - 不要依赖双击打开，那只是临时预览，不是真实运行环境
- 路径写法也受影响：
file://下相对路径容易解析错，而服务器环境下统一以/为站点根目录
HTML 的复杂点不在语法，而在它和 CSS、JS、HTTP、浏览器渲染流程的耦合。一个
<img alt="html如何入门_HTML入门学习步骤与基础知识点【教程】" >标签是否加载成功，可能取决于 src 路径、CORS 设置、图片格式支持、甚至 `loading="lazy"` 的兼容性。先让结构跑通，再一层层叠加约束条件。 -
