Skip to content
This page has been auto-translated and may contain errors.View in English

HTML 入门 ​

Juno

欢迎来到 HTML 手册!我是 Juno,很高兴你能来到这里。帮别人写出他们的第一个网页,是我最喜欢做的教学工作,看着 HTML 从一堆莫名其妙的尖括号变成有意义的东西,这种感觉我永远不会觉得厌倦。

我们会从最开始讲起,先弄清楚一个网页到底是什么,然后一点一点搭建起来。不需要任何经验。

这里没有什么问题是"太基础"而不能问的,按你自己的节奏来就好,我们一起走到终点!

Juno

欢迎来到 HTML 手册。我是 Ace,我喜欢把事情讲得实际一点。你对电脑已经比较熟悉了,所以我们会保持一个稳定的节奏,动手实践为主,就像你真正搭建一个页面时那样。

每一章都是先讲概念,再讲怎么用:读一读,试一试,动手搭建。整个网络世界基本都是靠这个循环建出来的,所以你不是一个人在战斗。

Juno

欢迎来到 HTML 手册。我是 Sol,做网页已经很多年了。这份文档是给那些想弄清楚 HTML 到底是怎么运作的人看的,不只是想知道哪个标签会渲染出哪个方框。

这里会讲到取舍、无障碍的细节,以及大多数教程会跳过的部分。HTML 看起来很简单,但"能渲染出来的标记"和"经得起考验的标记"之间的差距,正是真正的功夫所在。仔细读,也要质疑一切,包括我说的话。

这份手册是为所有刚开始接触网页开发的人准备的。HTML 是网络世界的第一门语言:它用纯文本描述一个页面上有什么内容,从标题、段落到图片、链接和按钮,都由它来描述。在你能给页面加样式或让它具备交互能力之前,你需要先描述这个页面包含什么,而这种描述方式就是 HTML。这里先说明一下你会一直看到的两个术语:**浏览器(browser)**是读取你的 HTML 并把页面画出来的程序,比如 Chrome 或 Safari;**元素(element)**是页面上一个带标签的独立部分,比如一个标题或一个段落。这里的每个概念都会讲得很完整,有深度、有示例,也方便你需要快速查阅时使用。

开始学习不需要任何编程经验。只要你会往文件里打字,就已经具备了学习前几章所需要的一切,其他内容会随着进度逐步介绍。HTML 几乎是每个网页开发者的起点,因为这世上再复杂的网站,归根到底都是建立在它之上的。

这份手册会从最基础的地方一步步展开。你会学到如何搭建页面结构、标记文本,如何添加链接和多媒体内容,如何用语义化标签让你的标记真正表达出意义,如何搭建能接收访客输入的表单,以及如何让页面对所有人都无障碍可用,也方便搜索引擎理解。每个知识点单独看都很小,但把它们叠加起来,就能搭出真正能上线的页面。

这里的讲解方式是解释每一部分 HTML 的作用以及背后的原因,而不只是告诉你该打什么代码。照着例子把标签抄一遍,看着屏幕上出现点东西,谁都能做到。但要真正搭建出可读、无障碍、又容易修改的页面,中间的差距就在于你是否理解你写的标记对浏览器、对屏幕阅读器、以及对下一个要修改代码的人意味着什么。这种理解才是能在任何一个项目之后都留存下来的东西。

JunoHTML 经久不变 关于 HTML,有一件很美好的事:它几乎不会变。你今天学的这些标签,和多年前专业网站用的是同一套,未来多年也还会继续用。所以你在这里学的东西不会过时。你是在坚实的地基上搭建。
JunoHTML 经久不变 HTML 非常稳定。新元素添加得很慢,旧元素几乎从不会被废弃,因为整个网络世界的建设原则就是不破坏已有页面。这意味着你现在投入的时间会一直有回报,你在这里学到的东西也能迁移到你之后接触的每一个框架和工具上。
JunoHTML 经久不变 HTML 几乎是你会接触到的所有技术里最稳定的一个。向后兼容几乎是不可动摇的原则,所以十年前写的页面现在依然能正常渲染,词汇表的变化也慢得像冰川移动。正因为这种稳定性,把基础打牢才格外值得:只要基本功学对了,不管明年上面套的是什么框架,它都稳得住。

认识你的向导 ​

这份手册由三位向导主持,你可以自己选一位来带你走完全程。内容对所有人都是一样的;你选的向导决定了讲述的语气,以及在那些会自适应的页面上,每个部分讲得有多深入。

你可以随时通过每页顶部的选择器切换向导,或者打开右下角的偏好设置来更改向导、语言或字号。

准备好之后,手册就正式开始了。下一章什么是 HTML,会讲清楚 HTML 到底是什么,以及标签、元素和属性这套小小的词汇体系,而后面整条学习路径都建立在这套基础之上。

更想通过动手实践来学习?Scrimba 的免费 HTML 和 CSS 课程通过五个项目和 75 多个互动挑战,带你学习同样的内容。