本书针对初、中级读者，特别是针对入门级读者。书中包含了经过精心筛选的学习CSS必须要了解和掌握的所有内容。全书共包含60多个练习，加上配套光盘中提供的完整的练习文件，帮助读者在实践中学习和掌握CSS的原理和技巧。
　　本书从回顾CSS的基本知识开始，深入讲解如何构建引人注目的导航和页面布局，同时示范如何进行页面排版，如何巧妙地使用颜色、背景和空白。再通过真实的项目让你体验到创建网页的过程。一步一个台阶！
　　本书面向初级和中级CSS学习者和使用者，也适合广大网页设计人员和爱好者阅读。

　　本书配套光盘包含了课堂验证用的练习文件和QuickTime格式的讲座视频及本书附录内容。

无

Lynda Weinman为本书写的序
　　很多人都会购买计算机图书自己学习，然而，令人吃惊的是，老师写书很少。令我感到自豪的是，HOT（HandsOn Training，实际操作培训或上机培训）系列图书都是由经验丰富的老师编写的，这些老师对在某一个专业领域中如何培训学生非常熟悉。在本书中，你会发现精心设计的用以帮你学习CSS(Cascading Style Sheets，层叠样式表）的练习——CSS是今天最引人注目的，同时也是一门通用的Web设计语言。
　　本书面向初级和中级的Web设计者、编程人员和Web设计师，也适合希望简单快捷地学习基本的CSS属性和Web样式设计的读者。实际操作的最终目的，是使读者通过积极地参与本书内容的学习，加快掌握CSS的进程。阅读样式化文档、标记和原理是一回事，而亲自动手编写这些样式和文档并完成具有一定水准的作品则又是另一回事。我们的座右铭是“看书，跟着练，然后掌握这个主题”。我收到过不计其数的感谢信，而我们的目标就是让每一本HOT系列的图书都能够印证这一座右铭。
本书的初衷不是讲述CSS的方方面面，而是致力于构建一个坚实的基础，以便读者能够更容易地学习更难掌握的技术。本书作者Eric和我都认为，现在书架上还缺少一本面向过程的教程，用来教会读者核心的原理、技术以及实用技巧。
　　我们期待着你将反馈发送到csshot@lyndacom。如果在学习本书的过程中，你遇到了什么问题，请访问技术支持链接wwwlyndacom/books/HOT/css。
　　Eric和我都希望本书能够全面提升你的CSS和Web设计技能。如果我们的希望被你实现了，则说明我们完成了自己设定的任务！
　　——Lynda Weinman
　　关于lyndacom
　　lyndacom由Lynda Weinman和Bruce Heavin于1996年共同创办，同年，Lynda推出了革命性著作《Designing Web Graphics》。从创立至今，lyndacom已经成为图形和Web专业人员培训领域的领导者，是全世界公认的可以依赖的教育培训机构。
　　lyndacom提供范围广泛的HOT系列图书，该系列图书旨在引导用户通过真实的项目，循序渐进的完成学习过程。lyndacom同时还提供种类繁多的视频形式的教程，这些教程通过CD、DVD和lyndacom在线培训资源库（Online Training Library）等形式发布。此外，lyndacom还拥有Flashforward Conference and Film Festival。
　　要了解与lyndacom有关的更多信息，请访问wwwlyndacom。要了解有关Flashforward Conference and Film Festival的更多信息，请访问wwwflashforwardconferencecom。
　　本书作者Eric AMeyer简介
　　Eric AMeyer自1993年起专注于Web领域，是世界最知名的HTML、CSS和Web标准方面的专家，他写的书受到了读者广泛欢迎。他是Complex Spiral（wwwcomplexspiralcom）公司的创始人，该公司旨在帮助客户通过使用面向标准的Web设计技术节省投入和提高效率，主要客户包括苹果公司、Adobe公司和韦尔斯法戈银行等。
　　他是《Eric Meyer on CSS》（New Riders出版社）和《Cascading Style Sheets: The Definitive Guide》（OReilly出版社）的作者，同时也为A List Apart、Vitamin、the OReilly Network、Web Techniques及Web Review撰写了大量文章。 Eric是CSS工作组的成员之一，并为该组织工作长达7年。而且，他还负责协调并创建W3C官方的CSS测试程序CSS Test Suite。 Eric曾受邀到各类组织做过演讲，其中包括美国洛斯阿拉莫斯国家实验室（Los Alamos National Laboratory）、纽约市公共图书馆（the New York Public Library）、康奈尔大学（Cornell University）和北爱荷华大学（University of Northern Iowa）。此外，Eric也经常在各种重要会议上发言或进行技术展示，这些会议包括An Event Apart （他也是该活动的合办者）、IW3C2 WWW系列会议、 Web Design World、the CMP Web系列会议、SXSW、the User Interface系列会议以及The Other Dreamweaver Conference等。
IW3C2，即国际万维网会议委员会，是国际万维网会议（the International Conference of World Wide Web，简称WWW会议）的组织机构。——译者注Eric AMeyer的致谢
　　我感谢lyndacom的全体成员，感谢他们与我共同完成了这个特殊项目的开发与制作。其中包括（很可能不限于）Garo Green、Tanya Staples、Max Smith、Lauren Harmon、Garrixk Chow、Scott Cullen、Alex Marino，当然还有Lynda Weinman。
　　说起来可能会令人觉得荒谬（尽管同我一样的作者们会心知肚明），写一本入门级的书对作者而言真是一个不小的挑战。正是因为来自lyndacom每一个人的支持、鼓励和指导，才使我在长时间的努力之后做好了这件事，并且没有偏离做这个项目的初衷。谢谢你们每一个人，也谢谢大家。
　　我还要感谢Dan Short答应在我写作初稿期间为我提供帮助；感谢Molly Holzschlag开始时为我提供的好建议。
　　最后，最深的感谢，还要一如既往地送给我的妻子和女儿。
　　如何使用本书
　　以下内容包括使用本书的注意事项。
本书结构
本书由几部分构成，包括循序渐进的练习、解说、注释、提示、补充内容以及视频教程。其中，每一个练习都有编号。文件名、文件夹名、代码指令、键盘快捷键以及URL（Uniform Resource Locators，统一资源定位符）都以粗体表示，以利于读者辨别。比如filenamehtm，images文件夹，文件>新建，Ctrl+单击，wwwlyndacom。
屏幕界面截图
本书中的大多数屏幕截图都取自Apple Power Mac G5计算机，因为作者主要是在Mac平台上完成设计、开发和编写工作的。本书也会提到基于Windows系统的计算机，在涉及两个平台之间有重要差异的内容时，作者会给出提示。
CSS HOT CDROM（随书光盘）中的内容
CSS HOT CDROM中包含很多有用的资源，主要有：练习文件、视频教程和与产品注册有关的信息。在开始实际练习之前，请先阅读以下内容，以便了解如何使用练习文件和视频教程。
练习文件
练习文件包含在CSS HOT CDROM的exercise_files文件夹中，是完成本书中练习的必要文件。所有练习文件按章进行分类，在开始每章的练习之前，读者应该把该章的文件夹复制到自己计算机的桌面上。例如，在开始学习第5章之前，应该从CSS HOT CDROM的exercise_files文件夹中把05_color文件夹复制到桌面上。
在Windows平台中，操作系统会自动给从CD上复制下来的文件添加写保护，这意味着读者不能修改文件。但是，这个限制很容易解决。要了解完整的操作步骤，请参考下面“在Windows计算机中去掉写保护”中的内容。
视频教程
在本书中，读者会发现一些指向视频教程的引用。视频教程一方面可以巩固并加强读者对书中相关概念的理解。另一方面，还会为读者提供一些有意思而且非常实用的资料。要观看视频教程，读者必须先在计算机中安装Apple QuickTime Player播放软件。如果本机中没有，可以到苹果公司网站wwwapplecom/quicktime上下载该播放软件。
在观看视频教程之前，请先从CSS HOT CDROM中把视频文件复制到你的硬盘中。双击想要观看的视频文件，该文件就会自动在QuickTime Player中打开。请检查计算机中的音量设置是否没有处于静音状态，以保证听到声音。
附录
附录内容包括CSS 2属性、疑难解答和技术支持信息、CSS学习资源。
在Windows计算机中去掉写保护
在默认情况下，当从DVD中把文件复制到Windows计算机中时，这些文件会设置为只读（写保护）状态。这样一来，读者将无法编辑和保存其中的练习文件。可以按照下列操作步骤修改文件的只读属性：
1打开CSS HOT CDROM中的exercise_files文件夹，将其中一个子文件夹，如05_color复制到你的桌面上。
2打开复制到你桌面上的05_color文件夹，然后选择“编辑>全选”。
3右键单击选中的文件，然后从弹出的上下文菜单中选择“属性”。
4在“属性”对话框中，单击“常规”选项卡。取消对“只读”选项的选择，以禁用对05_color文件夹中所选文件的只读限制。然后，单击“确定”按钮。
在Windows计算机中查看练习文件的扩展名
在默认情况下，在Windows计算机中看不到文件的扩展名，例如htm、fla、swf、jpg、gif或psd。不过，要想看到这些扩展名也很容易。请按照以下步骤进行设置：
1在你的桌面上，双击“我的电脑”图标。注意：如果你（或其他人）修改了这个图标的名称，那这个图标的名称可能不是“我的电脑”。2选择“工具>文件夹选项”打开“文件夹选项”对话框。选择“查看”选项卡。
3在“高级设置”中，取消对“隐藏已知文件类型的扩展名”复选框的选定，就可以看到所有文件的扩展名了。
系统要求
Windows或Macintosh
 支持CSS的Web浏览器（Internet Explorer、Firefox、Safari、Opera、Mozilla）。
 文本编辑软件。
 能够上网。
获取软件的演示版
如果读者想体验一下本书用到的软件的演示版，可以通过下列地址下载：
Firefox：wwwgetfirefoxcom
Bare Bones Software公司的BBEdit：wwwbarebonescom/products/bbedit/indexshtml

本书针对初、中级读者，特别是针对入门级读者。书中包含了经过精心筛选的学习CSS必须要了解和掌握的所有内容。全书共包含60多个练习，加上配套光盘中提供的完整的练习文件，帮助读者在实践中学习和掌握CSS的原理和技巧。 本书从回顾CSS的基本知识开始，深入讲解如何构建引人注目的导航和页面布局，同时示范如何进行页面排版，如何巧妙地使用颜色、背景和空白。再通过真实的项目让你体验到创建网页的过程。一步一个台阶！ 本书面向初级和中级CSS学习者和使用者，也适合广大网页设计人员和爱好者阅读。 本书配套光盘包含了课堂验证用的练习文件和QuickTime格式的讲座视频及本书附录内容。

Eric A. Meyer：Eric A. Meyer: Eric A. Meyer自1993年起专注于Web相关领域。Eric是W3C层叠样式表和格式化属性（CSS&FP）工作组的特邀专家，负责协调并创建了W3C的CSS 1测试套件（Test Suite）。他经常受邀在各种会议上就CSS、Web设计、Web标准、Web浏览器以及这些主题的交叉领域发表演讲。他还是《Eric Meyer on CSS》、《More Eric Meyer on CSS》和《Cascading Style Sheets: The Definitive Guide》等书以及众所周知的CSS Browser Compatibility Charts的作者。

李松峰：暂无简介

CSS是一种Web标准。所以，我想先简单介绍一点与Web标准有关的背景，然后再向读者推荐这本书。
　　随着CSS和JavaScript的兴盛，现代Web开发很快达到了高潮。而且，明确地将Web前端（客户端或者说浏览器）开发划分为结构层（XHTML）、行为层（JavaScript）和表现层（CSS），也是近两三年之内的事。里程碑式的事件就是2003年5月New Riders出版社出版了Jeffrey Zeldman的那本《Designing With Web Standards》。自此以后，无论是国外还是国内，“Web标准”逐渐成为Web开发领域中的热门关键词。
　　Jeffrey Zeldman于1998年创立了Web标准组织（Web standards Project）（中文简介页面http://wwwwebstandardsorg/about/mission/zhsimplified/），该组织在说服浏览器开发商（主要是网景和微软公司）结束长达近十年的浏览器战争，推动基于标准开发浏览器方面作出了卓越的贡献。在Web开发中，当提到跨平台、兼容性时，通常都是指以下几款浏览器：
 Internet Explorer。
 Firefox。
 Opera。
 Safari。
　　然而，基于Web标准开发可不是指基于浏览器开发，更不是基于IE或某一款浏览器开发。Web标准只提供了Web开发相关技术的接口（API，应用编程接口）和规范，比如由W3C（Word Wide Web Consortium，万维网联盟）制定并颁布的XTHML、DOM和CSS规范，由ECMA（European Computer Manufacturers Association，欧洲计算机制造商协会）制定并颁布的ECMA 262（JavaScript）规范，并确保这些规范能够很好地协同。理想化的基于标准的Web开发，应该是一方面浏览器开发商全部实现了标准规定的特性，另一方面是开发者采用标准规定的手段开发网站和Web应用程序。举个例子更好理解。以计算机主板为例，比如英特尔提出ATX结构的主板标准后，支持该标准的主板厂商都必须按照统一的电气性能、物理结构和插槽规范进行设计生产。而生产主板上各种板载配件的厂商，如生产CPU、内存、声卡、显卡、硬盘等配件的厂商，也必须按照统一的电气性能、物理结构和插槽规范进行设计生产。这样，支持ATX标准的主板和支持同一标准的内存才能兼容。而且，标准化也节省了大量的重复设计和多重规范所造成的浪费，极大地提高了生产效率，降低了生产成本，最终才使我们自己动手DIY电脑成为可能。
　　然而，现实的世界并不是理想的世界。由于在Web标准出现之前，浏览器已经出现了，而且展开了旷日持久的浏览器大战。在这场没有硝烟的战争中，浏览器厂商纷纷提出自己的规范和模型，试图将自己的“企业标准”通过市场占有率提升为事实上的行业标准、国际标准，从而达到垄断Web开发产业的目的。由于在浏览器战争中微软的IE以压倒性的优势胜出，所以，早期的Web开发者们多数都是基于市场占有率最高的IE进行Web开发。只要在IE中能够正常浏览，那就没问题了——因为当时的用户绝大多数都在使用IE上网。
　　短短几年间，随着命运多舛的Firefox（这款浏览器曾因商标权冲突几易其名，Phoneix、Firebird都是它的曾用名）和表现不俗的Opera、Safari等支持Web标准的浏览器受到越来越多上网用户的青睐，加上各种推动Web标准的人士和组织、机构的鼓与呼；今天，以Firefox为代表的标准浏览器阵营已经与IE形成了分庭抗礼的局面。而且，据权威机构调查，在高知识人群中Firefox的用户已经超过了IE。因此，今天的Web开发者，必须要面对跨浏览器开发的现实。而要进行跨浏览器开发，最有效率的方式就是面向Web标准开发。好消息是，市场形势的逆转，迫使IE在支持Web标准的道路上迈出实质性的步伐，特别是在对CSS标准的支持方面，2006年10月份发布的IE 7与以前的版本相比已经有了质的飞跃。比如，实现了正确的盒模型、支持非a 元素的鼠标悬停事件、支持相邻选择符、支持固定定位以及修正大量的不规范行为等。并且，目前正在开发中的IE 8也在2007年12月份宣布通过了Web标准组织发布的Acid2测试（主要用于测试浏览器是否支持CSS 21其他标准特性的测试程序。
　　开弓没有回头箭。为了保住市场份额，IE在支持标准方面所作努力的结果，具体到CSS开发领域，就是开发者只编写一个CSS样式表，就能使页面在所有支持标准的浏览器中拥有一致的外观。门槛降低了，效率提高了，开发者省心了，用户也满意了。
　　众所周知，CSS是一门经过W3C标准化的语言。当前受到普遍支持的标准版本是CSS 21（http://wwww3org/TR/CSS21/）。在基于标准的Web开发中，CSS负责控制表现层。正如本书作者Eric所比喻的：如果HTML是人的身体（想象一下body 标签），那么CSS就是穿在人身上的衣服。穿衣打扮能够展示人的形像，体现人的品位，同样，通过为网页应用样式也能塑造网站的形像，提升网站的品位。如果想学习Web开发，哪怕就是想做一个仅包含几个页面的微型网站，那么学习CSS都是明智的选择。
　　同样是在两三年之前，国内市场上有关CSS的书可以说廖若晨星。然而，自2006年下半年起，随着Web标准意识的觉醒，各种CSS的本版和外版书纷纷在国内市场上抢滩登陆，占据了Web开发设计书架上显眼的位置。您可能会问，在这么多CSS书中，这本书有什么不同？作为译者，我想以第一读者的身份试着来回答这个问题，以便帮您决定是拿着它到收款台付款，还是把它放回到书架上。
　　首先，这是一本针对初、中级读者，特别是针对入门级读者的书。书中涵盖的内容没有像作者的“权威指南”那样包罗万象，但是包含了经过精心筛选的学习CSS必须要了解和掌握的所有内容。包括选择符与层叠、基本的CSS布局、前景和背景属性、页面排版、外边距、内边距和边框的实用技术、样式化表格、设计打印样式表等。而且，全面介绍了CSS样式表的类型、如何有效地组合和管理样式表、CSS中样式规则的冲突诊断和解决机制等内容，并在各个章节中穿插了很多实用性极强的提示和辅助信息。可以说，这些内容既简单又重要，是理解和设计符合标准的CSS的必备基础知识。
　　其次，这是一本注重实践的书。这本书秉承了lyndacom HOT（Handson Training，实际操作培训）系列图书的风格，以实践见长。全书共包含60多个练习，加上配套光盘中提供的完整的练习文件，致力于让读者在实践中学习和掌握CSS的原理和技巧。事实上，学习任何一门语言，关键都是要经过Get your hands dirty（亲自动手）的过程，书中的文字和插图永远只是表象，真正上机实践才是掌握一门技术的不二门径。只通过看书就成为CSS高手的例子，是根本没有的。这种面向练习、面向实战的CSS书，就译者目前对CSS技术书的“阅历”来说，应该还是绝无仅有的。
　　最后，这是一本高起点的CSS书。学习一门新知识、新技术，起点的重要性不言而喻。好的起点，意味着一个好的开始，而好的开始则是成功的一半。相对于Eric其他几本CSS专著来说，这是唯一一本入门级的CSS书，也是最新出版的一本书，可以说是作者厚积薄发、含英咀华的结晶。Eric在CSS业内堪称大师级人物，如果读者在迈出学习CSS的第一步时就能得到大师的启蒙，相信这样一个开局的意义是不难想象的。我们常说，要站在巨人的肩膀上，现在“巨人的肩膀”就在你的脚下。如果是我，我会毫不犹豫地站上去，体验一下“会当凌绝顶，一览众山小”的大气磅礴。说实话，真得很希望当初自己在学习CSS时能够遇到这么好的一本书。
　　当然，作为大师著作的译者，我在保持大师语言的幽默感和精准性方面也尽了最大的努力，尽我所能地为读者奉献一堂原汁原味的大师启蒙课。不过，囿于个人水平和能力，翻译中的错误和不当之处在所难免。如果读者发现了书中的问题，请务必本着“治病救人”的精神，在我的个人网站http://wwwcncuckoocom中给予指出，或者将电子邮件发送到lsfemail@yahoocomcn。最后也是最重要的，我要感谢机械工业出版社华章分社陈冀康编辑对我翻译本书提供的良好支持，感谢本书其他审稿老师对本书所作的修改和审订，这对本书的质量提供了切实的保证。
　　本书由李松峰负责翻译，参加翻译工作的还有李丽、程宝杰、宋连海、付荣艳、封耀杰、贾爱华、左艳坡、熊俊芹、刘英、宋会敏等。

　　编者
　　2007年11月13日于北京

译者序
前言


第1章CSS入门
11为什么需要这本书
111本书的读者对象
112本书涵盖的内容
113本书的目标
12CSS是什么
121可以把CSS比作衣服
122虽然简单但很强大
13为什么使用CSS
131标记更容易维护
132网页文件更小
133访问网站的速度更快
134有助于搜索引擎优化
14编写CSS
141纯文本编辑器
142Style Master
143TopStyle
144Dreamweaver
第2章理解CSS
21回顾XTHML
22CSS术语
23练习1向样式表中添加规则
24练习2添加选择符
25练习3应用多个声明
26样式表的类型
261嵌入式样式表
262外部样式表
263内联样式
27练习4嵌入一个样式表
28练习5导入一个外部样式表
29练习6导入多个样式表
210练习7链接到外部样式表
211管理样式表
2111创建一个样式表，将它用于
多个页面
2112使用可组合的样式
2113使用模块化的样式
2114为什么要坚持使用外部
样式表
第3章选择符与层叠
31理解选择符
311元素选择符
312ID选择符
313类选择符
314后代选择符
32练习1使用ID选择符
33练习2使用类选择符
34练习3使用组合选择符
35练习4使用后代选择符
36查找样式的来源
37练习5通过针对性来解决样式
冲突
38练习6使用!important声明
39练习7理解继承
310练习8显示未添加样式的文档
311练习9应用用户样式表
第4章通过CSS影响页面布局
41练习1 CSS盒模型简介
42练习2创建简单的浮动
43练习3使用浮动进行页面布局
44练习4修复分栏下沉
45练习5清除的实质
46练习6包含浮动元素
47练习7显示元素
第5章设置前景和背景属性
51练习1添加前景颜色
52练习2为元素背景添加颜色
53练习3添加背景图像
54练习4重复背景图像
55练习5定位背景图像
56练习6使用简写的背景声明
第6章排版属性
61练习1修改行高
62练习2使用字体系列
63练习3修改字形和粗细
64练习4改变字体大小
65练习5简写的font声明
66练习6水平对齐文本
67练习7垂直对齐文本
68练习8转换文本
69练习9装饰文本
第7章使用外边距和边框创建空白
和间隔
71练习1理解外边距
72练习2添加边框
73练习3应用内边距
74练习4使用负外边距
75练习5折叠外边距
第8章设计表格
81练习1设计表格和表头
82练习2为表格单元添加样式
83练习3通过类为表格列应用样式
84练习4为表格单元中的链接应用
样式
第9章设计打印样式表
91练习1为特定的媒体设计
样式表
92练习2创建打印样式表
93练习3在打印样式表中隐藏
元素
94练习4改进打印样式表设计
95练习5在打印样式表中添加复杂的
样式
96练习6创建页脚
第10章综合
101使用文本片段
102练习1设置全局样式
103练习2定义页眉和导航栏颜色
104练习3布置导航栏
105练习4分栏布局
106练习5设置内容样式
107练习6开始设计侧边栏
108练习7创建侧边栏盒子
109练习8进一步设计侧边栏
1010练习9设计表格样式
1011练习10创建页脚
附录