学习 Web 开发 | MDN

HTML: Markup language
CSS: Styling language
JavaScript: Scripting language
Web APIs: Programming interfaces
Learn web development
Get to know MDN better
此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
View in English Always switch to English
欢迎来到 MDN 学习 Web 开发区（也被大家称为学习区）。我们在此提供一组结构化的教程指南，帮助你掌握要成为一名成功的前端开发者所需要具备的核心技巧与实践方式，同时也为你提供了若干挑战与推荐的进阶资源。
向所有前端开发者提供核心技巧与知识，帮助他们取得职业成功与成为业界有价值的开发者，就如在 MDN 课程中所定义的那样。
学习区内容由 MDN 社区创建，并不断经由学生、教师与更广阔 Web 社区提供的建议进一步优化。
学习区旨在让你实现从“萌新”到“舒适”（而非“萌新”到“专家”）的蜕变，并帮助你学会如何利用更多进一步的资源（例如 MDN 的其他内容）。
备注：最后更新时间：2025 年八月（参见更新记录）。
感兴趣来听一下与我们文章互补的交互式的视频课程？Scrimba 的前端开发者生涯路径MDN 学习合作伙伴也提供在 MDN 课程中所教授的主题内容。
我们的入门模块为完全初学者提供了设置教程和基本概念及背景知识。如果你完全没有编程经验（比如还没安装代码编辑器或写过代码），建议从这里开始。
我们的核心模块提供了一套结构化教程，帮助你掌握成为成功前端开发者所需的核心技能和实践。
我们的扩展模块涵盖了你在扩展知识和发展专长时需要学习的有用技能。完成核心模块后可以继续学习这些内容。
你可以用我们的模块指导教学，访问教师页面获取更多想法。
在整个课程中，你会遇到多篇旨在帮助你检验学习效果的文章。主要有两种类型：
大多数问题都包含 HTML/CSS/JavaScript 代码块，展示每个任务的起始代码。推荐点击代码块中的 “Play” 按钮，在 MDN Playground 中打开示例，然后根据题目要求编辑代码完成任务。
如果出错，可以使用 Playground 的重置按钮清除你的操作。如果实在卡住了，通常可以在每道题的底部查看参考答案，或联系我们。
备注：如果你更喜欢在自己的编辑器或在线编辑器（如 CodePen 或 JSFiddle）中操作，你也可以将 Playground 的代码复制到你选择的环境中。
有些问题没有提供起始代码块，而是让你下载起始文件并在本地操作完成。这通常是因为问题较为复杂，或者我们希望你换种方式练习。
你在学习区遇到的所有代码示例都托管在 GitHub 上：
如果你有任何想法或问题，欢迎通过交流渠道联系我们。无论是发现了网站内容的问题或遗漏、希望新增学习主题、遇到不理解的内容需要帮助，还是其他任何建议或疑问，我们都很乐意听取。
如果你有兴趣参与内容开发或改进，请查看如何参与并联系我们！无论你是学习者、教师、经验丰富的开发者，还是其他希望提升学习体验的人，我们都非常欢迎。
Scrimba 的前端开发者职业路径提供了成为合格前端开发者所需的全部知识，包含有趣的互动课程和挑战、专业的讲师和支持社区。从零基础到找到第一份前端工作！课程中许多内容可免费单独学习。
一个非常适合零基础学习编程语言的互动网站。
提供互动教程和项目，帮助你学习 Web 开发。
非常适合初学者的 JavaScript 学习资源——在互动环境中学习 JavaScript，课程短小精悍，配有自动评测。前 40 课免费，也只需要一次小支出即可购入完整课程。
此页面最后更新于 2026年1月27日，由 MDN 贡献者更新。
本内容的部分版权归 mozilla.org 贡献者所有，©1998–2026。内容依据知识共享许可协议提供。