CSS 第一步

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

¥CSS (Cascading Style Sheets) is used to style and lay out web pages — for example, to alter the font, color, size, and spacing of your content, split it into multiple columns, or add animations and other decorative features. This module provides a gentle beginning to your path towards CSS mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to HTML.

先决条件

¥Prerequisites

在开始本模块之前，你应该：

¥Before starting this module, you should have:

  1. 基本熟悉使用计算机和被动使用网络（即查看它、消费内容。）
  2. 设置基本工作环境（如 安装基本软件 中详述），并了解如何创建和管理文件（如 处理文件 中详述）。
  3. 基本熟悉 HTML，如 HTML 简介 模块中所述。

注意：如果你正在使用无法创建自己的文件的计算机/平板电脑/其他设备，你可以尝试在线编码程序（例如 JSBin 或 Glitch）中的（大部分）代码示例。

¥Note: If you are working on a computer/tablet/other device where you don't have the ability to create your own files, you could try out (most of) the code examples in an online coding program such as JSBin or Glitch.

指南

¥Guides

本模块包含以下文章，将带你了解 CSS 的所有基本理论，并为你提供测试一些技能的机会。

¥This module contains the following articles, which will take you through all the basic theory of CSS, and provide opportunities for you to test out some skills.

什么是 CSS？

CSS（层叠样式表）允许你创建美观的网页，但它的幕后工作原理是什么？本文通过一个简单的语法示例解释了什么是 CSS，并且还介绍了有关该语言的一些关键术语。

CSS 入门

在本文中，我们将使用一个简单的 HTML 文档并对其应用 CSS，并在此过程中学习一些有关该语言的实用知识。

CSS 的结构如何

现在你已经了解了 CSS 是什么以及使用它的基础知识，是时候更深入地了解该语言本身的结构了。我们已经了解了这里讨论的许多概念；如果你发现后面的任何概念令人困惑，你可以返回到这一节进行回顾。

CSS 的工作原理

我们已经学习了 CSS 的基础知识、它的用途以及如何编写简单的样式表。在本文中，我们将了解浏览器如何采用 CSS 和 HTML 并将其转换为网页。

评估

¥Assessments

以下评估将测试你对上述指南中涵盖的 CSS 基础知识的理解。

¥The following assessment will test your understanding of the CSS basics covered in the guides above.

设计传记页面的样式

根据你在前几篇文章中学到的知识，你应该发现可以使用 CSS 格式化简单的文本文档，并向其添加你自己的样式。此评估为你提供了这样做的机会。