HTML文件必须保存为.html或.htm后缀、UTF-8编码，并包含<!DOCTYPE html>、<html lang="zh-CN">和<meta charset="UTF-8">三要素，缺一不可。
直接上手写一个能打开的 index.html 文件，比看十篇教程都管用。别纠结“先学什么再学什么”，HTML 没有前置依赖，只要浏览器能打开，你就已经入门了。
怎么保存文件才能被浏览器识别为网页
很多人卡在这一步：写了代码，双击却弹出记事本或报错。核心就一条——后缀名必须是 .html 或 .htm，且保存类型选“所有文件”。
- Windows 记事本：点击「文件 → 另存为」→ 在「文件名」栏输入
index.html（注意引号不要带）→ 「保存类型」下拉选「所有文件」→ 点击保存 - Mac 文本编辑：「格式 → 使纯文本」→ 「文件 → 存储」→ 文件名填
index.html→ 编码选「Unicode (UTF-8)」→ 存储 - 常见错误：
index.txt.html、index.html.txt、没改保存类型导致实际存成index.html.txt—— 这些都会让双击失效
必须写对的三行“启动代码”
每次新建 HTML 文件，直接复制粘贴这三行，后面再填内容。少一行，浏览器可能不认，或者中文乱码、标题不显示。
<!DOCTYPE html> <html lang="zh-CN"> <head><meta charset="UTF-8"><title>我的第一个网页</title></head> <body> <h1>你好，世界！</h1> <p>这是我的第一段文字。</p> </body> </html>
-
<!DOCTYPE html>必须顶格写在第一行，不能缩进，不能加空格，不能漏叹号 -
lang="zh-CN"不是必须，但加了能让屏幕阅读器和搜索引擎更好理解语言，建议加上 -
<meta charset="UTF-8">必须放在<head>里，位置靠前；写成utf8或UTF8有些老浏览器可能不识别，严格用UTF-8
哪些标签写错会导致页面“看起来没反应”
不是代码报错才叫错——很多错误是静默失效：你写了，但浏览器根本不渲染，或者内容消失。最常踩的坑集中在标签闭合和路径大小写。
立即学习“前端免费学习笔记（深入）”；
-
<p>忘写闭合</p>：现代浏览器会自动补全，但若后面紧跟<div>或其他块级元素，可能导致样式错位或 JS 获取不到内容 -
<img src="photo.jpg" alt="描述">中的src路径错：文件在images/photo.jpg，却写成photo.jpg或Images/photo.jpg（Linux/macOS 区分大小写） -
<a href="about.html">关于我们</a>：链接目标文件名拼错，比如写成abot.html，点击后 404，但页面本身完全正常，容易误以为“链接功能坏了” - 标签名写成大写：
<P>文字</P>虽然多数浏览器能渲染，但不符合 HTML5 规范，VS Code 等编辑器会标黄警告，协作时会被 lint 工具拦截
练完立刻能验证的最小闭环动作
别等“学完一章”再测试。每加一个新标签，就做一次“保存 → 切到浏览器 → Ctrl+R 刷新”。这个节奏一旦建立，学习速度会明显加快。
- 加一个
<h2>，刷新看是否变小一号标题 - 加一张本地图片，刷新看是否加载成功；失败就立刻检查路径和文件是否存在
- 加一个
<ul><li>列表项</li></ul>，刷新确认是否出现圆点列表 - 修改
<title>内容，刷新后看浏览器标签页文字是否变化——这是验证<head>是否生效最直观的方式
真正卡住新手的，从来不是标签记不住，而是“写了但看不见效果”时不知道从哪查起。路径、编码、后缀、大小写——这四个点盯死，90% 的“怎么没反应”问题当场解决。
