此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。

View in English Always switch to English

Web 入门

Web 入门模块是一套介绍 Web 开发实践的系列文章。你会收集资源并编写代码来构建一个简单的网页,然后将其发布,以便全世界都能看到。

创建一个专业的网站需要大量的工作,因此如果你是 Web 开发的新手,我们会鼓励你从小事做起。虽然你无法立刻再建一个 Facebook,但是做一个简单的网站并不难,我们将由此开始。

前提

此系列假设你对 Web 技术没有了解,但你应已熟练使用你的操作系统,包括文件系统和 Web 浏览。你应该已安装代码编辑器和多个 Web 浏览器。

若你尚未满足以上条件,建议你首先完成环境设置的学习。

教程

你的网站会是什么样子?

在你开始为你的网站写代码之前,你应该先计划一下。需要展示什么信息?使用什么字体和颜色?我们概述了一个简单的方法,你可以按照这个方法来规划网站的内容和设计。

创建内容

超文本标记语言(HTML)是用于构建 Web 内容并赋予内容含义和目的的代码。例如,内容可通过段落结构、项目符号列表,或借助图片与数据表格进行组织。本文将帮助你掌握 HTML 的基础知识及其功能,并指导你创建首个网站的基本内容。

美化内容

层叠样式表(CSS)是为网页内容添加样式的代码。本指南将带你逐步掌握入门所需的知识,解答诸如:如何将文字设为红色、如何让内容在网页布局的特定位置显示、如何用背景图像和颜色装饰网页等常见问题。

添加交互

JavaScript 是用于为网站添加交互特性的编程语言。这种现象常见于游戏中,体现在按键响应行为、表单数据输入、动态样式应用、动画效果等场景。本文将助你开启 JavaScript 学习之旅,并深化你对该语言可能性的理解。

发布你的网站

一旦完成了代码编写和构成网站的文件的组织工作,你就需要把它们全部放在网上,这样人们才能找到它。本文将说明如何轻松地将你的示例网站上线。

参见

前端开发者职业道路 MDN 学习伙伴

Scrimba前端开发者职业道路教授成为合格的前端 Web 开发者所需的知识,这里有有趣的交互式课程和挑战、有学识的老师以及提供帮助的社区。让你从零到获得第一份前端工作!许多课程有单独的免费版本。