教程
本页面涵盖着各式各样的教程和练习资料的链接。不管你是才入门,还是了解基础,抑或是 Web 开发老手,在这都能找到实用的最佳练习资源。
这些资源由卓有远见的公司和 Web 开发者创建(他们采用开放标准和最佳实践来开发 Web),并且这些资源通过知识共享(Creative Commons)等开放内容许可来提供且允许进行翻译
面向学习 Web 的纯新手
- Web 入门
-
Web 入门是一套简明的,介绍 Web 开发实践的系列文章。你会安装构建简单网页和发布简单代码所需的工具。
HTML 教程
初级
- HTML 简介
-
这个模块为学习 HTML 奠定了基础,让你熟悉重要的概念和语法,了解如何在文本中应用 HTML,如何创建超链接以及如何使用 HTML 构建网页结构。
- MDN 的 HTML 元素参考
-
完整的 HTML 元素参考以及不同浏览器的兼容性信息。
- 用 HTML 创建简单的网页
-
一篇面向初学者的 HTML 指南——解释常见的标签,其中包含 HTML 标签。同时包含一篇带代码示例的分步指南——创建基础的网页。
- HTML 挑战
-
这些挑战会打磨你的 HTML 技巧(例如,应该使用 <h2> 元素还是 <strong> 元素?)——专注有意义的标记。
中级
高级
- HTML 表单
-
表单是 Web 中非常重要的一部分——其提供了网站交互所需的很多功能,例如,注册、登录、发送反馈、购买产品,等等。在这个模块中你会学习如何创建客户端表单。
- 让 HTML 页面加载快的技巧
-
网页优化能为用户提供一个响应更好的站点,能减少 Web 服务器和互联网连接的加载时间。
CSS 教程
初级
- CSS 基础
-
CSS(层叠样式表)用于为网页添加样式。CSS 基础将带你了解入门所需的内容。这篇文章回答了如下问题:如何把文本变成黑色或者红色?怎么将内容显示到屏幕上的特定位置?怎么用背景图像或者颜色装饰网页?
- CSS 第一步
-
CSS(层叠样式表)用于为网页添加样式,对网页进行布局——例如,修改内容的字体、颜色、大小和间距,将内容分成多列,或添加动画和其它装饰特性。在前往掌握 CSS 基础知识(CSS 的运作方式,CSS 语法是什么样子,在 HTML 中如何使用 CSS 添加样式)的道路上,这个模块是一个很好的开始。
- CSS 构建块
-
这个模块承接 CSS 第一步——这时你已经熟悉 CSS 语言及其语法,有了基本的使用经验,是时候再深入一些。在这个模块中,你会学习层叠和继承、可用的选择器类型、单位、大小、为背景和边框添加样式、调试,以及其它内容。
这篇文章的目的是,在了解诸如为文本添加样式和 CSS 布局等特定领域的知识之前,提供一个能让你编写合格 CSS 的工具集并帮助你理解基本的理论。
- 选择器
-
用 CSS 定位 HTML 元素,其中包含带状态的元素。
- 优先级
-
通过优先级测验了解浏览器算法在遇到存在冲突的 CSS 声明时会决定将哪个声明应用到元素上。
- 层叠与继承
-
层叠、优先级和继承决定了 CSS 会如何应用于 HTML 中,以及如何解决样式声明冲突。
- 为文本添加样式
-
这篇文章介绍了为文本添加样式的基础知识,包括:设置字体、加粗、斜体、行间距、字间距、阴影和其它文本特性。在这个模块中,还会学习的内容有:在页面中应用自定义字体、为列表和链接添加样式。
- CSS 常见问题
-
面向初学者的常见问题和回答。
中级
高级
JavaScript 教程
初级
- JavaScript 第一步
-
在第一个 JavaScript 模块中,我们首先回答一些基本问题,例如“什么是 JavaScript?”、“它看起来是什么样的?”和“它能做什么?”,然后带你体验第一次实际编写 JavaScript。之后,我们将详细讨论一些关键的 JavaScript 特性,如变量、字符串、数字和数组。
- 创建 JavaScript 代码块
-
在这个模块中,我们将继续涵盖所有 JavaScript 的关键基础特性,重点关注常见的代码块类型,如条件语句、循环、函数和事件。你已经在课程中看到了这些内容,但只是顺便提及——在这里我们将明确讨论它们。
- 开始学习 JavaScript
-
JavaScript 是什么、JavaScript 如何帮助你?
- Codecademy
-
在 Codecademy 学习如何编写 JavaScript 很容易。Codecademy 提供了交互界面,你可以和你的朋友一起学。
- freeCodeCamp
中级
- 介绍 JavaScript 对象
-
在 JavaScript 中,大多数东西都是对象,从 JavaScript 核心特性(如字符串和数组)到构建在 JavaScript 之上的浏览器 API。你甚至可以创建自己的对象,将相关的函数和变量封装起来。如果你想进一步提高对语言的了解并编写更高效的代码,理解 JavaScript 的面向对象特性非常重要,因此我们提供了这个模块来帮助你。在这里,我们将详细教授对象理论和语法,看看如何创建你自己的对象,并解释 JSON 数据是什么以及如何使用它。
- 客户端 Web API
-
在为网站或应用程序编写客户端 JavaScript 时,你很快就会开始使用 API——用于操作浏览器和操作系统不同方面的接口,或者甚至是从其他网站或服务获取数据。在这个模块中,我们将探讨 API 是什么,以及如何使用一些你经常遇到的常见 API。
- JavaScript 编程精解
-
中高级 JavaScript 方法论的综合指南。
- 大话 JavaScript
-
面向想又快又好地学习 JavaScript 的程序员,也面向想提升技能或寻找特定主题的 JavaScript 程序员。
- 基本的 JavaScript 设计模式
-
介绍基本的 JavaScript 设计模式。
- JavaScript.info——现代 JavaScript 教程
-
卷一:语言。卷二:在浏览器中如何使用 JavaScript。
高级
- JavaScript 指南
-
一份全面且经常更新的 JavaScript 指南,面向从初级到高级的学习者。
- 你不了解 JS
-
深入 JavaScript 语言核心机制的系列书籍。
- JavaScript 花园
-
JavaScript 中最古怪部分的文档。
- 探索 ES6
-
和 ECMAScript 2015 相关的靠谱且有深度的信息。
- JavaScript 模式
-
JavaScript 模式和反模式合集:涵盖函数模式、jQuery 模式、jQuery 插件模式、设计模式、通用模式、字面量和构造函数模式、对象创建模式、代码复用模式、DOM。
- 浏览器的工作方式
-
一篇详细的研究文章:内容涵盖不同的现代浏览器、引擎、页面渲染等等。
- JavaScript 视频
-
必看的 JavaScript 视频合集。