HTML不是编程语言而是标记规则,三步即可入门:新建index.html写基础结构、实时刷新验证效果、通过删改标签理解语义;优先用语义化标签,属性值统一加双引号,表单控件必设name属性。

HTML 不是编程语言,不需要“学起”——它是一套标记规则,打开编辑器就能写,关键在于知道写什么、为什么这么写、浏览器怎么理解它。
从 到能跑通一个页面:三步动手流程
别看教程,直接新建一个 index.html 文件,用任意文本编辑器(VS Code、Notepad++、甚至记事本)写进去:
我的第一个页面 你好,世界
这是段落。
保存后双击用浏览器打开。看到内容了?你已经会 HTML 了。接下来只做三件事:
立即学习“前端免费学习笔记(深入)”;
- 每次改完一点,刷新浏览器看效果 —— 这是唯一可靠的验证方式
- 删掉某一行(比如
),再刷新,观察中文是否乱码 - 把
改成或,对比显示差异和的区别不是“块级/行内”,而是语义意图很多人死记“
是块级、是行内”,结果写出满屏套。其实浏览器根本不关心这个,真正重要的是:- 表示“这里有一块内容区域,暂时没想好语义”
表示“这里有一小段文字,暂时没想好语义”- 优先用
、、、等语义化标签,它们自带默认样式且利于 SEO 和可访问性- 只有当语义确实模糊时,才退回到
或属性值加不加引号?
class="menu"vsclass=menuHTML5 允许省略引号,但必须满足:属性值不含空格、等号、小于号、大于号、反引号、双引号、单引号。实际中几乎总会踩坑:
-
class=main menu→ 解析为两个属性:class="main"和未定义的menu(报错) -
href=/page?id=1&sort=asc→&会被当作实体解析,导致 URL 错误 -
data-id=123看似安全,但团队协作或未来加空格时极易出问题
结论:一律用双引号包裹属性值,包括
id、class、src、href—— 这不是教条,是避免调试时花 20 分钟找一个漏掉的空格。表单元素必须配
name,否则提交时根本不会发出去写一个
,看着能输,但提交后后端收不到。原因大概率是没写name属性:注意点:
-
id是给 CSS 或 JS 用的,和提交数据无关 -
name才是字段名,后端靠它接收值(如req.body.username) - 复选框组用相同
name,如name="hobby",多个才能被当做一个字段数组提交 - 没有
name的表单控件,无论有没有值,都不会出现在提交数据中
HTML 最容易被忽略的复杂点,其实是“浏览器如何把标签变成可交互的 DOM 节点”——但这不是入门阶段要深究的。先确保每个标签都带明确目的,每次修改都立刻在浏览器里验证,比记住所有标签更重要。











