CSS总结.doc

CSS总结
介绍 2
第1课:CSS是什么? 3
可以用CSS做什么? 3
采用CSS有哪些好处? 4
第2课:CSS的工作原理 4
基本的CSS语法 4
为一个HTML文档应用CSS 5
自己试试看 7
第3课:颜色与背景 8
‘background-color’属性 9
背景图像[background-image] 9
平铺背景图像[background-repeat] 10
固定背景图像[background-attachment] 11
放置背景图像[background-position] 12
缩写[background] 14
小结 14
第4课:字体 15
字体族[font-family] 15
字体样式[font-style] 16
字体变化[font-variant] 17
字体浓淡[font-weight] 17
字体大小[font-size] 17
缩写[font] 19
小结 20
第5课:文本 20
文本缩进[text-indent] 20
文本对齐[text-align] 21
文本装饰[text-decoration] 21
字符间距[letter-spacing] 22
文本转换[text-transform] 22
小结 23
第6课:链接 23
伪类是什么? 23
伪类: hover 25
例1:有鼠标悬停的链接的效果 25
例2:去掉链接的下划线 26
小结 27
第7课:元素的分类与标识(class和id) 27
用class对元素进行分类 28
利用id标识元素 29
小结 30
第8课:组织元素(span和div) 31
用span组织元素 31
用div组织元素 32
小结 33
第9课:盒状模型 33
CSS中的盒状模型 33
小结 34
第10课:外边距和内边距 35
为元素设置外边距 35
为元素设置内边距 36
小结 37
第11课:边框 37
边框宽度[border-width] 38
边框颜色[border-color] 38
边框样式[border-style] 38
一些示例 39
缩写[border] 40
小结 41
第13课:浮动元素(float) 41
如何实现这个效果? 42
另一个例子:列 42
clear属性 44
小结 44
第14课:元素的定位 45
CSS定位的原理 45
绝对定位 46
相对定位 47
小结 48
第15课:用z-index进行层次堆叠 48
小结 50
介绍
级联样式表(Cascading Style Sheets,CSS)是一种为网站添加布局效果的出色工具。它可以省去你大量时间,令你可以采用一种全新的方式来设计网站。CSS是每个网页设计人员所必须掌握的。
本CSS教程能够让你在数小时内入门CSS。它很容易理解,而且将向你介绍所有高级技巧。
学习CSS是很有趣的。你在学得留有充分的时间来实践你在每一课中学到的知识。
使用CSS要求你有基本的HTML经验。如果你不熟悉HTML,那么请在开始学习CSS之前先学习我们提供的HTML教程。
我需要什么软件?
在学习本教程时,请不要使用类似FrontPage、DreamWeaver或Word这样的软件。这些高级软件对你学习CSS没有帮助。相反,它们会限制你,并显著减慢你的学习进度。
你所需要的只是一个免费的简易文本编辑器。
例如,微软视窗操作系统(Microsoft Windows)自带的记事本(Notepad)程序。你可以依次点击“开始菜单→程序→附件”找到该程序。如果你用的是其他操作系统,那么也有类似的简易文本编辑器可用,比如Linux上的Pico或Mac(苹果机)上的Simple Text。
采用简易文本编辑器来学习编写HTML和CSS是非常好的,因为它不会影响或修改你所输入的代码。这样,代码的对错完全取决于你自己,而不是软件。
你可以使用任何浏览器。但我们建议你把浏览器升级至最新版本。
你所需要的全部软件就是一个浏览器和一个简易文本编辑器。
我们现在开始学习CSS吧!
第1课:CSS是什么?
也许你曾听说过CSS,但并不真正清楚CSS到底是什么。在这一课,你将学到更多CSS的知识,并了解CSS可以做些什么。
CSS是Cascading Style Sheets(级联样式表)的缩写。
可以用CSS做什么?
CSS是一种样式表语言,用于为HTML文档定义布局。例如,CSS涉及字体、颜色、边距、高度、宽度、背景图像、高级定位等方面。拭目以待吧!
HTML可以用于为网站添加布局效果,但有可