精通CSS与HTML设计模式(包含350余种设计模式)(china-pub首发)
点击看大图基本信息
- 原书名： Pro CSS and HTML Design Patterns
- 原出版社： Apress
编辑推荐
Amazon盛誉图书.
业界专家十余年功力结晶，参透CSS与HTML..
350多种可以立刻用于实战的设计模式
Web设计与开发人员的必备参考书...
推荐阅读
内容简介回到顶部↑
本书是一部非常实用的css 与html（xhtml）解决方案手册。书中包含了350 多种可以立即使用的设计模式（涉及文本、背景、边框、图片、表格、布局等多方面），并介绍了每种模式的原理和使用。每种设计模式、示例和源代码都经过了精心设计，易于实现和使用。通过阅读此书，可大大提高读者在web 设计和开发中的效率和创造力。
本书结构清晰，示例丰富，实践性强，适用于所有web 开发和设计人员。
本书结构清晰，示例丰富，实践性强，适用于所有web 开发和设计人员。
作译者回到顶部↑
本书提供作译者介绍
Michael Bowers，资深Web开发专家，有18年专业软件开发经验。曾经作为首席软件工程师和架构师开发过各种项目，包括许多网站、应用程序框架、编译器、自定义语言，自动化工厂和销售管理系统。他拥有音乐理论硕士学位，是一名优秀的钢琴家。
.. << 查看详细
.. << 查看详细
目录回到顶部↑
第1章 设计模式：轻松搞定css！
1.1 设计模式——精心组织的解决方案
1.2 使用设计模式
1.3 应用样式表
1.4 css语法
1.4.1 css语法细节
1.4.2 在css中使用空白
1.4.3 使用属性值
1.5 使用层叠排序
1.6 简化层叠
1.7 css和html链接
1.8 css属性
1.9 css的属性和值：常见的
1.10 css的属性和值：内容
1.11 css的属性和值：布局
1.12 css的属性和值：专有的
1.13 选择符
1.14 变动的度量单位
1.15 固定的度量单位
1.16 在96dpi下不同单位之间的比率
1.1 设计模式——精心组织的解决方案
1.2 使用设计模式
1.3 应用样式表
1.4 css语法
1.4.1 css语法细节
1.4.2 在css中使用空白
1.4.3 使用属性值
1.5 使用层叠排序
1.6 简化层叠
1.7 css和html链接
1.8 css属性
1.9 css的属性和值：常见的
1.10 css的属性和值：内容
1.11 css的属性和值：布局
1.12 css的属性和值：专有的
1.13 选择符
1.14 变动的度量单位
1.15 固定的度量单位
1.16 在96dpi下不同单位之间的比率
译者序回到顶部↑
从事Web前端开发的人一定碰到过以下情况中的某一种：在Firefox中显示完全正常的页面，到IE下却发生了错乱；布局中某处一像素的偏差，调整过来反而会导致整个页面的变形；为表格赋予样式后，却完全达不到预期的效果；绝对定位元素跑到了相对定位的后面，而如果设置z-index，不同浏览器的解析方式还不一致，等等。HTML和CSS就是这么奇妙，看似简单的语言，在实际应用中，由于它们的不同排列组合，产生了千奇百怪的效果——这令很多开发者不知所措。如果你也正被它所困扰，那么本书就是你最好的选择了。.
本书的英文名为Pro CSS and HTML Design Patterns——其中的“Patterns”说明了它所介绍的内容，在牛津的英英字典中对这个单词有这么一段解释：“a regular and intelligible form or sequence discernible in certain actions or situations”，瞧，人家解释得多精辟。而我们在前端开发中，最需要的也就是它所指的“Patterns”——能够在不同情况下告诉我们如何去做，以及会产生什么效果。本书共总结了350多种模式，这些模式都是从实际开发的不同情境中提炼出来的。所以，当你碰到某个问题的时候，你可以把它拆开来看，它一定会跟书中某一种或几种模式的组合相对应。当然，你不用（也不太可能）把这350多种模式都背下来，只要知道有哪些模式以及它们所对应的情境，当需要的时候再查阅本书就可以了。..
本书可以作为一本实用的工具书，也可以作为一本很好的教学用书。因此本书既满足了有经验的Web开发者的需求，又非常适合前端初学者的入门。
本书由刘申、朱瑜敏、鲁奇共同翻译，刘申负责统稿。在这里要感谢FreeWheel的董彬，百度的李春平、咸立华、李国新等朋友在译者翻译期间所给予的大力帮助。最后要特别感谢宋薇对本书所提供的技术支持。由于本书较厚，外加翻译时间较紧，译文中难免有错漏之处，欢迎大家批评指正。...
译者
2008年4月于哈工大
本书的英文名为Pro CSS and HTML Design Patterns——其中的“Patterns”说明了它所介绍的内容，在牛津的英英字典中对这个单词有这么一段解释：“a regular and intelligible form or sequence discernible in certain actions or situations”，瞧，人家解释得多精辟。而我们在前端开发中，最需要的也就是它所指的“Patterns”——能够在不同情况下告诉我们如何去做，以及会产生什么效果。本书共总结了350多种模式，这些模式都是从实际开发的不同情境中提炼出来的。所以，当你碰到某个问题的时候，你可以把它拆开来看，它一定会跟书中某一种或几种模式的组合相对应。当然，你不用（也不太可能）把这350多种模式都背下来，只要知道有哪些模式以及它们所对应的情境，当需要的时候再查阅本书就可以了。..
本书可以作为一本实用的工具书，也可以作为一本很好的教学用书。因此本书既满足了有经验的Web开发者的需求，又非常适合前端初学者的入门。
本书由刘申、朱瑜敏、鲁奇共同翻译，刘申负责统稿。在这里要感谢FreeWheel的董彬，百度的李春平、咸立华、李国新等朋友在译者翻译期间所给予的大力帮助。最后要特别感谢宋薇对本书所提供的技术支持。由于本书较厚，外加翻译时间较紧，译文中难免有错漏之处，欢迎大家批评指正。...
译者
2008年4月于哈工大
前言回到顶部↑
本书是讲述如何使用CSS 2.1为HTML 4.01和XHTML 1.1添加样式的解决方案手册。书中包含了350多种可以立即使用的设计模式。每一种模式都是模块化的，并且可以进行自定义，可以将这些模式结合起来创建出无数种模式。.
每一种设计模式都经过了严格的测试，并已证实可以应用于所有主要的网页浏览器，包括IE 7、IE 6、Firefox 2、Opera 9和Safari 2。
书中的全部内容均是可用和实用的。谁也不愿意浪费时间看那些用不上的东西。有了本书，你就不再需要为了能在多个浏览器中生效而使用各种奇技淫巧、没完没了地测试和不停地修改了。
使用一种设计模式很简单，将其复制粘贴到你的代码中然后修改一些值。本书将告诉你哪些值是可以修改的，对结果的影响如何，这样你就可以创建精确的样式，按需要进行布局，而无须担心它是否有效。
然而本书又不仅仅是一部解决方案手册。它系统地讲述了CSS的每一个可用的特征，并将这些特征与HTML结合创建出可复用的模式。每种模式都有一个直观的名称，便于查找、记忆和讨论。每种设计模式、例子和源代码都经过了精心设计，充分考虑了可访问性，运用了最佳实践。
你可以从头至尾通读本书，将它作为参考或用它寻找解决问题的方案。书中统一的版式会令你喜欢上它的，使用便是一种愉悦。
一般情况下书的左边页面是例子，右边是解释。每个例子都包含一个屏幕截图和所有相关的HTML和CSS代码，这样可以清楚地看到每种模式是如何工作的。每种模式的解释在例子的右侧书页上，你可以在阅读它如何工作的同时很方便地学习这个例子。
这种版式使本书的电子版也非常方便，因为你可以在同一屏幕中看到例子和它的解释。否则，就需要在页面间来回滚动，这对于电子书来说是很困难的。
每种设计模式都有一个名称，位于每页的顶端，便于查找、记忆和讨论。因为名称、屏幕截图、代码和解释都位于固定的位置，所以你可以迅速地翻查，以找到你所需要的内容。
设计模式是通过主题（topic）组织的，并且与其他书不同的是，本书在具体应用上深入地讲解了所有实用的CSS规则。全部设计模式都是可访问的并且运用了最佳实践，因此本书值得通读，而且当你设计和编写代码时，可将本书放在手边作为一个极好的参考。
本书可以提高你在网页设计和开发中的效率和创造力。设计模式就像拼装玩具，可以用无数种方式将它们组装并创建出任何效果。它们也像工具箱中的工具，本书用上百种工具将你武装起来，使你可以迅速正确地解决问题。本书将展示如何可预见地创建模式——通过组合不同的可预见模式（predictable pattern），而不是局限于某一种解决方案。
适用读者
本书是为那些对CSS和HTML有所了解的人士编写的。它适用于以前阅读过CSS和HTML入门书的新手，也适用于曾经尝试过CSS但无法正确运用而放弃的设计者和开发者们，适用于想要提高CSS技术的专业人士，适用于所有希望快速完成设计的人——有了本书，他们就不用自己不断摸索，找出可以在所有浏览器中生效的方案了。
本书假设读者已经了解了编写CSS和HTML代码的基础知识。如果你只在像Dreamweaver或FrontPage这种所见即所得的设计软件中工作而从没处理过HTML或CSS代码，你可能会觉得本书中的代码有些难度。
如果你喜欢通过例子学习，喜欢了解代码是如何工作的，并且对CSS和HTML有所了解，你肯定会爱上这本书的。
在第17章和第20章中，有7种设计模式使用了JavaScript。为了完全理解它们，你需要了解JavaScript的基础知识，但是使用这些模式不用精通JavaScript。最重要的是，你不需要知道任何有关JavaScript的知识来理解和使用书中的340多种设计模式，因为它们根本与JavaScript无关。
创新
本书包含了一些创新的概念、术语和方法。这些其实都不是新东西：那些技术已经内建于主要的浏览器中，概念也已隐含于CSS规范中，术语也是经常使用的。它们的创新之处在于定义和使用它们的方式，其中展示了CSS和HTML的巨大潜力。换言之，它们的创新之处在于它们简化了学习、理解和使用CSS和HTML的过程。这些理念改变了你对CSS和HTML的看法，使一切变得不同。而且书中许多设计模式都属于创新，因为它们展示了通过结合使用属性及元素，可以解决许多以前难以解决的问题。
6种盒模型
书中的一个创新是认为CSS有6种盒模型而不是一种。官方规定CSS只有一种盒模型，它定义了一套常用的属性和行为。单一的盒模型是很实用的概念，但是它过于简单。这么多年来，我下了不少苦功才发现，盒模型的属性根据其类型的不同会产生不同的效果。
每一种设计模式都经过了严格的测试，并已证实可以应用于所有主要的网页浏览器，包括IE 7、IE 6、Firefox 2、Opera 9和Safari 2。
书中的全部内容均是可用和实用的。谁也不愿意浪费时间看那些用不上的东西。有了本书，你就不再需要为了能在多个浏览器中生效而使用各种奇技淫巧、没完没了地测试和不停地修改了。
使用一种设计模式很简单，将其复制粘贴到你的代码中然后修改一些值。本书将告诉你哪些值是可以修改的，对结果的影响如何，这样你就可以创建精确的样式，按需要进行布局，而无须担心它是否有效。
然而本书又不仅仅是一部解决方案手册。它系统地讲述了CSS的每一个可用的特征，并将这些特征与HTML结合创建出可复用的模式。每种模式都有一个直观的名称，便于查找、记忆和讨论。每种设计模式、例子和源代码都经过了精心设计，充分考虑了可访问性，运用了最佳实践。
你可以从头至尾通读本书，将它作为参考或用它寻找解决问题的方案。书中统一的版式会令你喜欢上它的，使用便是一种愉悦。
一般情况下书的左边页面是例子，右边是解释。每个例子都包含一个屏幕截图和所有相关的HTML和CSS代码，这样可以清楚地看到每种模式是如何工作的。每种模式的解释在例子的右侧书页上，你可以在阅读它如何工作的同时很方便地学习这个例子。
这种版式使本书的电子版也非常方便，因为你可以在同一屏幕中看到例子和它的解释。否则，就需要在页面间来回滚动，这对于电子书来说是很困难的。
每种设计模式都有一个名称，位于每页的顶端，便于查找、记忆和讨论。因为名称、屏幕截图、代码和解释都位于固定的位置，所以你可以迅速地翻查，以找到你所需要的内容。
设计模式是通过主题（topic）组织的，并且与其他书不同的是，本书在具体应用上深入地讲解了所有实用的CSS规则。全部设计模式都是可访问的并且运用了最佳实践，因此本书值得通读，而且当你设计和编写代码时，可将本书放在手边作为一个极好的参考。
本书可以提高你在网页设计和开发中的效率和创造力。设计模式就像拼装玩具，可以用无数种方式将它们组装并创建出任何效果。它们也像工具箱中的工具，本书用上百种工具将你武装起来，使你可以迅速正确地解决问题。本书将展示如何可预见地创建模式——通过组合不同的可预见模式（predictable pattern），而不是局限于某一种解决方案。
适用读者
本书是为那些对CSS和HTML有所了解的人士编写的。它适用于以前阅读过CSS和HTML入门书的新手，也适用于曾经尝试过CSS但无法正确运用而放弃的设计者和开发者们，适用于想要提高CSS技术的专业人士，适用于所有希望快速完成设计的人——有了本书，他们就不用自己不断摸索，找出可以在所有浏览器中生效的方案了。
本书假设读者已经了解了编写CSS和HTML代码的基础知识。如果你只在像Dreamweaver或FrontPage这种所见即所得的设计软件中工作而从没处理过HTML或CSS代码，你可能会觉得本书中的代码有些难度。
如果你喜欢通过例子学习，喜欢了解代码是如何工作的，并且对CSS和HTML有所了解，你肯定会爱上这本书的。
在第17章和第20章中，有7种设计模式使用了JavaScript。为了完全理解它们，你需要了解JavaScript的基础知识，但是使用这些模式不用精通JavaScript。最重要的是，你不需要知道任何有关JavaScript的知识来理解和使用书中的340多种设计模式，因为它们根本与JavaScript无关。
创新
本书包含了一些创新的概念、术语和方法。这些其实都不是新东西：那些技术已经内建于主要的浏览器中，概念也已隐含于CSS规范中，术语也是经常使用的。它们的创新之处在于定义和使用它们的方式，其中展示了CSS和HTML的巨大潜力。换言之，它们的创新之处在于它们简化了学习、理解和使用CSS和HTML的过程。这些理念改变了你对CSS和HTML的看法，使一切变得不同。而且书中许多设计模式都属于创新，因为它们展示了通过结合使用属性及元素，可以解决许多以前难以解决的问题。
6种盒模型
书中的一个创新是认为CSS有6种盒模型而不是一种。官方规定CSS只有一种盒模型，它定义了一套常用的属性和行为。单一的盒模型是很实用的概念，但是它过于简单。这么多年来，我下了不少苦功才发现，盒模型的属性根据其类型的不同会产生不同的效果。
媒体评论回到顶部↑
“不管你是什么水平的开发人员，本书都是必备的参考书。”.
——Jonathan Snook，著名Web程序员，The Art and Science of CSS一书作者
“我太喜欢这本书了。事实上我买了两本，一本放在公司，一本放在家里……本书讲解非常系统，既值得通读，也是绝佳的参考书……赶紧买一本好好研读吧。”...
——Java Ranch．com
——Jonathan Snook，著名Web程序员，The Art and Science of CSS一书作者
“我太喜欢这本书了。事实上我买了两本，一本放在公司，一本放在家里……本书讲解非常系统，既值得通读，也是绝佳的参考书……赶紧买一本好好研读吧。”...
——Java Ranch．com
书摘回到顶部↑
第1章设计模式：轻松搞定CSS！
1.1 设计模式——精心组织的解决方案
设计模式已经在软件开发领域取得了巨大的成功。它们大大提升了网页设计和开发中的生产力、创新力和效率，与此同时还大大减少了代码量和复杂性。在CSS和HTML中，设计模式可以看作是一系列常用功能的组合，它便网站可运行于不同的浏览器和读屏器上，却无需牺牲设计值、可访问性或者依靠其他旁门左道的技术。不过至今为止，设计模式还没有很系统地应用于HTML和Hcss网页设计与开发中。
设计模式是所有创造性活动的基础。当我们交谈、写作和创造时，都要依照某种模式来思考。设计模式就好比是文档的模板，我们可以向其中添加自己的内容。在文学作品中，它们就像是原型角色和情节。在音乐中，它们就好比主题和变奏。在编程中，它们就相当于可复用的算法，可以系统地改变这些算法，并互相结合以求达到理想的效果。
一旦发现了某种设计模式，就会大幅度地提高创新力和生产力。它可以独立使用，并可迅速得到成品；也可与其他的模式相结合，以创造更加复杂的效果。设计模式简化并增强了创新的过程。它们使创造就如同垒砖块或搭乐高积木一样简单。仅需选择预先设计好的模式，改造它们并使它们相互结合，即可得到想要的结果。模式并不会限制创新——它们会为你解开创新的枷锁。 开创性著作Design Patterns：Elements ofReusable Object-Oriented Software（中文版《设计模式：可复用面向对象软件的基础》，作者为Erich Gamma、Richard Helm、Ralph Johnson和John Vlissides，原版由Addison.Wesley版于1995年）曾阐述过，设计模式由4部分组成：模式的名字、要解决的问题、解决方案和各方面的权衡。本书将遵循这一方式。
既然这是一本实用性的书，那么它直接关注的是一些可用于各种主流浏览器中的具体的CSS和HTML设计模式。本书也通过组合内建的模式创造出更高级别的新模式。
简而言之，这是一本关于模式的书，你可以把这些模式应用到实际的设计当中去。
1.2使用设计模式
第1章到第7章列出了布局样式中的基本属性和元素。第8章与第9章把这些属性组合在一起，创造出了所有可能的块状、定位和浮动布局。第10章到第12章列举了一些基本的文本样式属性，并把它们相互结合，这样一杰，就可以用它们来创建内联布局了。
……
1.1 设计模式——精心组织的解决方案
设计模式已经在软件开发领域取得了巨大的成功。它们大大提升了网页设计和开发中的生产力、创新力和效率，与此同时还大大减少了代码量和复杂性。在CSS和HTML中，设计模式可以看作是一系列常用功能的组合，它便网站可运行于不同的浏览器和读屏器上，却无需牺牲设计值、可访问性或者依靠其他旁门左道的技术。不过至今为止，设计模式还没有很系统地应用于HTML和Hcss网页设计与开发中。
设计模式是所有创造性活动的基础。当我们交谈、写作和创造时，都要依照某种模式来思考。设计模式就好比是文档的模板，我们可以向其中添加自己的内容。在文学作品中，它们就像是原型角色和情节。在音乐中，它们就好比主题和变奏。在编程中，它们就相当于可复用的算法，可以系统地改变这些算法，并互相结合以求达到理想的效果。
一旦发现了某种设计模式，就会大幅度地提高创新力和生产力。它可以独立使用，并可迅速得到成品；也可与其他的模式相结合，以创造更加复杂的效果。设计模式简化并增强了创新的过程。它们使创造就如同垒砖块或搭乐高积木一样简单。仅需选择预先设计好的模式，改造它们并使它们相互结合，即可得到想要的结果。模式并不会限制创新——它们会为你解开创新的枷锁。 开创性著作Design Patterns：Elements ofReusable Object-Oriented Software（中文版《设计模式：可复用面向对象软件的基础》，作者为Erich Gamma、Richard Helm、Ralph Johnson和John Vlissides，原版由Addison.Wesley版于1995年）曾阐述过，设计模式由4部分组成：模式的名字、要解决的问题、解决方案和各方面的权衡。本书将遵循这一方式。
既然这是一本实用性的书，那么它直接关注的是一些可用于各种主流浏览器中的具体的CSS和HTML设计模式。本书也通过组合内建的模式创造出更高级别的新模式。
简而言之，这是一本关于模式的书，你可以把这些模式应用到实际的设计当中去。
1.2使用设计模式
第1章到第7章列出了布局样式中的基本属性和元素。第8章与第9章把这些属性组合在一起，创造出了所有可能的块状、定位和浮动布局。第10章到第12章列举了一些基本的文本样式属性，并把它们相互结合，这样一杰，就可以用它们来创建内联布局了。
……
)
加载中...
