第一个HTML文件可用记事本编写，关键要保存为UTF-8无BOM编码、扩展名.html且保存类型选“所有文件”；标准结构需含、、、和等标签。
用记事本就能写出来的第一个 HTML 文件
不需要安装任何软件，Windows 自带的记事本、macOS 的文本编辑（纯文本模式）、VS Code 都能直接新建并保存为 .html 文件。关键不是“怎么新建”，而是“保存时必须选对编码和扩展名”——很多人卡在这一步，双击打开是乱码或直接下载，其实是没保存成 UTF-8 无 BOM 格式。
- 在记事本中写完内容后，点「文件 → 另存为」
- 「文件名」填
index.html（不能是index.html.txt） - 「编码」选
UTF-8（Windows 记事本里叫“UTF-8”，不是“ANSI”或“Unicode”） - 「保存类型」选「所有文件」，否则会自动加
.txt
最简 HTML5 页面结构必须包含哪些标签
HTML5 不再强制要求 、、 全写，但实际开发中漏掉它们会导致语义混乱、CSS/JS 加载异常、SEO 失效。浏览器能“容错渲染”，不代表你应该依赖它。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>我的第一个页面</title> </head> <body> <h1>Hello World</h1> </body> </html>
必须顶格写在第一行，不能有空格或注释前置-
<meta charset="UTF-8">必须放在内且尽量靠前，否则中文可能乱码 -
中的lang属性影响屏幕阅读器和搜索引擎识别语言
双击打不开？检查这三件事
常见错误不是代码写错，而是环境或操作疏忽。尤其新手容易反复试错却忽略路径和协议问题。
- 文件路径含中文或空格：改成
D:\demo\index.html这种纯英文路径再试 - 用 Chrome 直接双击打开时地址栏显示
file:///开头——这是正常行为；但如果页面空白，右键「查看页面源代码」确认是否真的保存成功 - 修改后没刷新：Chrome 按
Ctrl + F5强制重载，避免缓存旧版本 - 误把文件存在系统目录（如
C:\Windows）：部分系统会拦截访问，移到桌面或文档目录再试
后续想加样式或交互，从哪一行开始改
静态页面不是“只能放文字”。只要在正确位置插入代码，立刻生效。别被“静态”二字吓住——它只表示不依赖服务器端语言（如 PHP），不是功能受限。
立即学习“前端免费学习笔记（深入）”；
- 加 CSS：在
里加<style>h1 { color: red; }</style>，或外链<link rel="stylesheet" href="style.css"> - 加 JS：在
前加<script>alert("加载成功");</script>，确保 DOM 已就绪 - 图片路径写相对地址：
<img src="photo.jpg" alt="html5静态网页怎么新建_零基础创建第一个页面方法【教程】" >表示和 HTML 同目录；不要用C:\xxx\photo.jpg这种绝对路径
真正容易被忽略的是：所有路径都以当前 HTML 文件为基准，而不是你双击打开时所在的文件夹。哪怕你从桌面双击运行，它的“根”仍是那个 index.html 所在目录。
