blob: 8518b2b14c4cb9b7258631d9c7f04a748c0f95a2 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
---
title: 学习CSS 第一步
slug: Learn/CSS/First_steps
tags:
- 初学者
- 学习
- 模型
- 第一步
translation_of: Learn/CSS/First_steps
---
<div><font><font>{{LearnSidebar}}</font></font></div>
<p class="summary"><font><font>CSS（层叠样式表）用于设置和布置网页 - 例如，更改内容的字体，颜色，大小和间距，将其拆分为多个列，或添加动画和其他装饰功能。</font><font>这个模块为你掌握CSS的过程提供了一个温和的开端，包括它如何工作的基础知识，语法是什么样的，以及如何开始使用它来为HTML添加样式。</font></font></p>
<h2 id="先决条件"><font><font>先决条件</font></font></h2>
<p><font><font>在开始本单元之前，您应该：</font></font></p>
<ol>
<li><font><font>基本熟悉使用计算机，并被动地使用Web（即查看它，消费内容）。</font></font></li>
<li><font><font>基本工作环境的设置详见</font></font><a href="/zh-CN/docs/Learn/Getting_started_with_the_web/Installing_basic_software"><font><font>安装基本软件</font></font></a><font><font>，并了解如何创建和管理文件，详见</font></font><a href="/zh-CN/docs/Learn/Getting_started_with_the_web/Dealing_with_files"><font><font>处理文件</font></font></a><font><font>。</font></font></li>
<li>熟悉 <a href="/zh-CN/docs/Learn/HTML/Introduction_to_HTML">HTML概述</a> 章节中提到的基本HTML知识.</li>
</ol>
<div class="note">
<p><strong>注意</strong>： 如果你工作在一个无权创建自己文件的电脑/平板/其他设备上，你需要在一个在线编程工具上试验 （大多数）代码示例，如 <a href="http://jsbin.com/">JSBin</a> 或者 <a href="https://thimble.mozilla.org/">Thimble</a> 等。</p>
</div>
<h2 id="指南">指南</h2>
<p><span class="tlid-translation translation" lang="zh-CN"><span title="">该模块包含以下文章</span></span> , 这些文章将带您了解CSS的所有基本理论，并提供测试一些技能的机会。</p>
<dl>
<dt><a href="/zh-CN/docs/Learn/CSS/First_steps/What_is_CSS">什么是 CSS?</a></dt>
<dd><strong>{{Glossary("CSS")}}</strong> (Cascading Style Sheets) 使你创建外观漂亮的网页，但它如何起作用的呢？这篇文章用一个简单的语法示例解释CSS是什么，还包括有关该语言的一些关键术语。</dd>
<dt><a href="/zh-CN/docs/Learn/CSS/First_steps/开始">CSS 入门</a></dt>
<dd>在本文中，我们将采用一个简单的HTML文档并将CSS应用于该文档，并在此过程中学习一些关于语言的实用内容。</dd>
<dt><a href="/zh-CN/docs/Learn/CSS/First_steps/How_CSS_is_structured">如何构建CSS？ </a></dt>
<dd>现在您已经了解了CSS是什么以及使用它的基础知识，现在是时候更深入地了解语言本身的结构。在这里，我们已经遇到了讨论过的许多概念; 如果你发现任何令人困惑的概念，你可以回到这个回顾。</dd>
<dt><a href="/zh-CN/docs/Learn/CSS/First_steps/CSS如何运行">CSS 如何工作</a></dt>
<dd>我们已经学习了CSS基础理论：CSS是什么以及如何编写简单的样式表。在这个课程中，我们将看看浏览器如何使用CSS和HTML并将其转换为网页。</dd>
<dt><a href="/zh-CN/docs/Learn/CSS/First_steps/Using_your_new_knowledge">用用你刚学到的知识</a></dt>
<dd><font><font>根据您在最后几课中学到的内容，您应该发现可以使用CSS格式化简单的文本文档，以便为它们添加自己的样式。</font><font>本文为您提供了实现这一目标的机会。</font></font></dd>
</dl>
<h2 id="相关链接">相关链接</h2>
<dl>
<dt><a href="https://teach.mozilla.org/activities/intermediate-web-lit/"><font><font>中级网络识字1：CSS简介</font></font></a></dt>
<dd><font><font>一个优秀的Mozilla基础课程，探索和测试</font></font><em><font><font>CSS</font></font></em><font><font>模块</font><em><font>简介中</font></em><font>谈到的许多技能</font><font>。</font><font>了解在网页上设置HTML元素的样式，CSS选择器，属性和值。</font></font></dd>
</dl>
|
