教程

¥For complete beginners to the Web

网络入门

Web 入门是一个简明的系列，向你介绍 Web 开发的实用性。你将设置构建简单网页并发布你自己的简单代码所需的工具。

¥HTML Tutorials

¥Introductory level

HTML 简介

本模块奠定了基础，让你习惯重要的概念和语法，了解如何将 HTML 应用于文本、如何创建超链接以及如何使用 HTML 构建网页。

MDN HTML 元素参考

HTML 元素的综合参考，以及不同浏览器如何支持它们。

使用 HTML 创建简单的网页

适合初学者的 HTML 指南，其中包括常见标记（包括 HTML 标记）的说明。还包括使用代码示例创建基本网页的分步指南。

HTML 挑战

利用这些挑战来磨练你的 HTML 技能（例如，"我应该使用 <h2> 元素还是 <strong> 元素？"），重点关注有意义的标记。

¥Intermediate level

多媒体和嵌入

本模块探讨如何使用 HTML 在网页中包含多媒体，包括包含图片的不同方式，以及如何嵌入视频、音频甚至整个其他网页。

HTML 表格

以可理解的 accessible 方式在网页上表示表格数据可能是一项挑战。该模块涵盖基本的表格标记，以及更复杂的功能，例如实现标题和摘要。

¥Advanced level

HTML 表单

表单是 Web 的一个非常重要的部分 - 它们提供了与网站交互所需的许多功能，例如 注册和登录、发送反馈、购买产品等。该模块帮助你开始创建表单的客户端部分。

创作快速加载 HTML 页面的技巧

优化网页，为访问者提供响应更快的网站，并减少 Web 服务器和 Internet 连接的负载。

¥CSS Tutorials

¥Introductory level

CSS 基础知识

CSS（层叠样式表）是用于设计网页样式的代码。CSS 基础知识将带你了解入门所需的内容。我们将回答以下问题：如何将文本设为黑色或红色？如何让我的内容显示在屏幕上的某个位置？如何使用背景图片和颜色装饰我的网页？

CSS 第一步

CSS（层叠样式表）用于设置网页的样式和布局 - 例如，更改内容的字体、颜色、大小和间距，将其拆分为多列，或添加动画和其他装饰功能。本模块为你掌握 CSS 之路提供了一个温和的开端，介绍了 CSS 的工作原理、语法以及如何开始使用它向 HTML 添加样式的基础知识。

CSS 构建块

本模块从 CSS 第一步 结束的地方继续进行 - 现在你已经熟悉了该语言及其语法，并获得了一些使用它的基本经验，是时候更深入地研究了。该模块着眼于级联和继承、我们可用的所有选择器类型、单位、大小、背景和边框样式、调试等等。

这里的目的是为你提供一个用于编写合格 CSS 的工具包，并帮助你在继续学习 文本样式 和 CSS 布局 等更具体的学科之前理解所有基本理论。

选择器

使用 CSS 定位 HTML 元素，包括基于元素状态。

特异性

了解浏览器算法，以确定在存在竞争声明（带有 特异性测验）时将哪些 CSS 声明应用于元素

级联与继承

级联、特异性和继承控制着 CSS 如何应用于 HTML 以及如何解决样式声明之间的冲突。

设置文本样式

在这里，我们了解文本样式的基础知识，包括设置字体、粗体和斜体、行距和字母间距以及阴影和其他文本功能。我们通过将自定义字体应用到你的页面以及样式列表和链接来完善该模块。

常见 CSS 问题

初学者的常见问题和解答。

¥Intermediate level

CSS 布局

至此，我们已经了解了 CSS 基础知识、如何设置文本样式以及如何设置内容所在框的样式和操作。现在是时候看看如何将盒子放置在相对于视口以及彼此正确的位置了。我们已经介绍了必要的先决条件，因此现在可以深入研究 CSS 布局，查看不同的显示设置、涉及浮动和定位的传统布局方法，以及新的奇特布局工具（如 Flexbox）。

CSS 参考

CSS 的完整参考，包含有关 Firefox 和其他浏览器支持的详细信息。

流体网格

设计布局可随浏览器窗口流畅地调整大小，同时仍使用印刷网格。

CSS 挑战

发挥你的 CSS 技能，看看哪些地方需要更多练习。

¥Advanced level

使用 CSS 变换

使用 CSS 应用旋转、倾斜、缩放和平移。

CSS 过渡

CSS 过渡提供了一种对 CSS 属性进行动画更改的方法，而不是让更改立即生效。

画布教程

了解如何使用 canvas 元素通过脚本绘制图形。

¥JavaScript Tutorials

¥Introductory level

JavaScript 第一步

在我们的第一个 JavaScript 模块中，我们首先回答一些基本问题，例如 "什么是 JavaScript？"、"它是什么样子的？" 和 "它能做什么？"，然后再带你体验编写 JavaScript 的第一次实践经验。之后，我们详细讨论一些关键的 JavaScript 功能，例如变量、字符串、数字和数组。

JavaScript 构建块

在本模块中，我们将继续介绍 JavaScript 的所有关键基本功能，并将注意力转向常见的代码块类型，例如条件语句、循环、函数和事件。你已经在课程中看到了这些内容，但只是顺便看到了 - 在这里我们将明确地讨论它们。

JavaScript 入门

什么是 JavaScript？它对你有何帮助？

代码学院

Codecademy 是学习如何编写 JavaScript 代码的简单方法。它是互动的，你可以和你的朋友一起做。

freeCodeCamp

freeCodeCamp 教授各种 Web 开发语言和框架。它还具有 forum、网络广播电台 和 blog。

¥Intermediate level

JavaScript 对象介绍

在 JavaScript 中，大多数事物都是对象，从字符串和数组等核心 JavaScript 功能到构建在 JavaScript 之上的浏览器 API。你甚至可以创建自己的对象，将相关函数和变量封装到高效的包中。如果你想进一步了解该语言并编写更高效的代码，那么了解 JavaScript 面向对象的本质非常重要，因此我们提供了此模块来帮助你。在这里，我们详细教授对象理论和语法，了解如何创建自己的对象，并解释什么是 JSON 数据以及如何使用它。

客户端 Web API

为网站或应用编写客户端 JavaScript 时，在开始使用 API 之前你不会走得太远 - 用于操作网站运行的浏览器和操作系统的不同方面的接口，甚至来自其他网站或服务的数据 。在本模块中，我们将探讨什么是 API，以及如何使用你在开发工作中经常遇到的一些最常见的 API。

雄辩的 JavaScript

中级和高级 JavaScript 方法的综合指南。

说 JavaScript

适合想要快速正确学习 JavaScript 的程序员，以及想要加深技能和/或查找特定主题的 JavaScript 程序员。

基本的 JavaScript 设计模式

介绍基本的 JavaScript 设计模式。

JavaScript.info - 现代 JavaScript 教程

第 1 部分：语言。第 2 部分：使用浏览器。

¥Advanced level

JavaScript 指南

定期更新的全面 JavaScript 指南，适合从初学者到高级的各个级别的学习。

你不懂 JS

一系列深入探讨 JavaScript 语言核心机制的书籍。

JavaScript 花园

JavaScript 最古怪部分的文档。

探索 ES6

有关 ECMAScript 2015 的可靠且深入的信息。

JavaScript 模式

JavaScript 模式和反模式集合，涵盖函数模式、jQuery 模式、jQuery 插件模式、设计模式、通用模式、文字和构造函数模式、对象创建模式、代码重用模式、DOM。

浏览器如何工作

详细的研究文章描述了不同的现代浏览器、它们的引擎、页面渲染等。

JavaScript 视频

可供观看的 JavaScript 视频合集。

¥Extension Development

WebExtensions

WebExtensions 是一个用于开发浏览器附加组件的跨浏览器系统。该系统很大程度上兼容 Google Chrome 和 Opera 支持的 扩展 API。为这些浏览器编写的扩展在大多数情况下将在 Firefox 或 微软 Edge 和 只需进行一些更改 中运行。该 API 也与 多进程火狐 完全兼容。