| title | slug | l10n | ||
|---|---|---|---|---|
教程 |
Web/Tutorials |
|
本页面涵盖着各式各样的教程和练习资料的链接。不管你是才入门，还是了解基础，抑或是 Web 开发老手，在这都能找到实用的最佳练习资源。
这些资源由卓有远见的公司和 Web 开发者创建（他们采用开放标准和最佳实践来开发 Web），并且这些资源通过知识共享（Creative Commons）等开放内容许可来提供且允许进行翻译
- Web 入门
- : Web 入门是一套简明的，介绍 Web 开发实践的系列文章。你会安装构建简单网页和发布简单代码所需的工具。
- HTML 简介
- : 本模块分为几个阶段：熟悉重要的概念和语法、在文本中应用 HTML、创建超链接、使用 HTML 构建网页。
- MDN 的 HTML 元素参考
- : 完整的 HTML 元素参考以及不同浏览器的兼容性信息。
- 用 HTML 创建简单的网页
- : 一篇面向初学者的 HTML 指南——解释常见的标签，其中包含 HTML 标签。同时包含一篇带代码示例的分步指南——创建基础的网页。
- HTML 挑战
- : 这些挑战会打磨你的 HTML 技巧（例如，应该使用 <h2> 元素还是 <strong> 元素？）——专注有意义的标记。
- 多媒体和嵌入
- : 本模块探索了在网页中如何使用 HTML 嵌入多媒体，包含：不同的嵌入图像的方法，以及嵌入视频、音频，甚至完整的其它网页的方式。
- HTML 表格
- : 在网页中以一种{{glossary("Accessibility", "易懂的")}}的方式展示表格数据是个挑战。本模块涵盖的内容是：基本的表格标记，以及复杂一点的特性（诸如标题和摘要）。
- HTML 表单
- : 表单是 Web 中非常重要的一部分——其提供了网站交互所需的很多功能，例如，注册、登录、发送反馈、购买产品，等等。在本模块中你会学习如何创建客户端表单。
- 让 HTML 页面加载快的技巧
- : 网页优化能为用户提供一个响应更好的站点，能减少 Web 服务器和互联网连接的加载时间。
-
- : CSS（层叠样式表）用于为网页添加样式。CSS 基础将带你了解入门所需的内容。本文回答了如下问题：如何把文本变成黑色或者红色？怎么将内容显示到屏幕上的特定位置？怎么用背景图像或者颜色装饰网页？
-
- : CSS（层叠样式表）用于为网页添加样式，对网页进行布局——例如，修改内容的字体、颜色、大小和间距，将内容分成多列，或添加动画和其它装饰特性。在前往掌握 CSS 基础知识（CSS 的运作方式，CSS 语法是什么样子，在 HTML 中如何使用 CSS 添加样式）的道路上，本模块是一个很好的开始。
-
- : 用 CSS 定位 HTML 元素，其中包含带状态的元素。
-
- : 通过优先级测验了解浏览器算法在遇到存在冲突的 CSS 声明时会决定将哪个声明应用到元素上。
-
- : 层叠、优先级和继承决定了 CSS 会如何应用于 HTML 中，以及如何解决样式声明冲突。
-
- : 本文介绍了为文本添加样式的基础知识，包括：设置字体、加粗、斜体、行间距、字间距、阴影和其它文本特性。在本模块中，还会学习的内容有：在页面中应用自定义字体、为列表和链接添加样式。
-
- : 面向初学者的常见问题和回答。
- CSS 布局
- : 看到这儿，你已经学习过 CSS 基础知识、如何为文本添加样式、如何为放置内容的盒子添加样式并操纵它。现在，是时候学习参照视口或另一个盒子时如何将盒子放置在正确的位置。必要的前置知识已经具备，此时你可以深入 CSS 布局，学习不同的显示设置、传统的布局方式（使用浮动和定位）、新发明的布局工具（如弹性盒）。
- CSS 参考
- : 完整的 CSS 参考，以及火狐和其它浏览器的兼容性信息。
- 流式网格
- : 设计一种能随着浏览器窗口大小变化而流畅地调整大小的布局，且仍使用排版网格。
- CSS 挑战
- : 展示你的 CSS 技巧，看看哪些地方还需要加强练习。
- 使用 CSS 变换
- : 用 CSS 实现旋转、倾斜、缩放和平移。
- CSS 过渡
- : CSS 过渡提供一种以动画的形式来改变 CSS 属性的方式，而非让改变立即生效。
- Canvas 教程
- : 学习如何使用画布元素和脚本绘制图形。
- JavaScript 第一步
- : 在第一个 JavaScript 模块中，你会了解一些基础知识，例如，JavaScript 是什么、JavaScript 是什么样、JavaScript 能做什么。然后你会体验初次编写 JavaScript。紧接着，你会详细地学习一些关键的 JavaScript 特性，例如，变量、字符串、数字和数组。
- 创建 JavaScript 代码块
- : 在本模块中，你会继续学习关键的 JavaScript 基础特性，注意力会转向常见的代码块类型，例如，条件语句、循环、函数和事件。这些概念在课程中早已见过，但只是一扫而过——这里会明确地讨论这些概念。
- 开始学习 JavaScript
- : JavaScript 是什么、JavaScript 如何帮助你？
- Codecademy
- : 在 Codecademy 学习如何编写 JavaScript 很容易。Codecademy 提供了交互界面，你可以和你的朋友一起学。
- freeCodeCamp
- 介绍 JavaScript 对象
- : 在 JavaScript 中，对象普遍存在，从核心 JavaScript 特性（如字符串和数组）到构建于 JavaScript 之上的浏览器 API。你甚至可以自己创建对象，将相关的函数和变量高效地封装起来。如果你想深入了解 JavaScript 并编写更高效的代码，那么理解 JavaScript 的面向对象的特性非常重要。本模块会讲解这方面的知识。你会学习对象理论和语法的细节，学习如何创建对象，学习 JSON 数据是什么以及如何使用 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 视频合集。