Xiaoxiao's Weblog » css http://liuyuntian.com Mon, 06 Feb 2012 16:54:24 +0000 en hourly 1 http://wordpress.org/?v=3.3 《CSS禅意花园》中文版 http://liuyuntian.com/2007/04/18/css-zen-garden-the-chinese-version.html http://liuyuntian.com/2007/04/18/css-zen-garden-the-chinese-version.html#comments Wed, 18 Apr 2007 22:11:36 +0000 xiaoxiao http://liuyuntian.com/2007/04/18/css-zen-garden-the-chinese-version.html 　　《THE ZEN OF CSS DESIGN: VISUAL ENLIGHTENMENT FOR THE WEB》的中文版《CSS禅意花园》开始发售了。

　　Chinapub宣传地址：　http://www.china-pub.com/STATIC07/0703/jsj_flying_070314.asp

　　购买地址：http://www.china-pub.com/computers/common/info.asp?id=33191

　　今年应该是前台制作较缺的一年，有喜欢研究CSS或从事这一行的朋友们可以观注一下这本书。

　　

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2007/04/18/css-zen-garden-the-chinese-version.html/feed 4 [新书]Transcending CSS: The Fine Art of Web Design http://liuyuntian.com/2006/12/21/transcending-css-the-fine-art-of-web-design.html http://liuyuntian.com/2006/12/21/transcending-css-the-fine-art-of-web-design.html#comments Thu, 21 Dec 2006 09:39:28 +0000 xiaoxiao http://liuyuntian.com/2006/12/21/transcending-css-the-fine-art-of-web-design.html 　　今年讲CSS的书真的不少，一本是Andy的《CSS Mastery》已经在国内有的翻译卖了，到年底了，Andy Clark出版了《Transcending CSS》。

　　这里是官方网站：　http://www.transcendingcss.com/
　　
　　作者介绍：Andy Clarke has been working on the web for almost ten years. He is a visual web designer based in the UK and started his design consultancy Stuff and Nonsense in 1998. As lead designer and creative director, his clients include local and national businesses, charities and government bodies and he has designed for The British Heart Foundation, Disney Store UK, Save The Children and WWF UK.

　　Amazon购买点这里

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2006/12/21/transcending-css-the-fine-art-of-web-design.html/feed 0 CSS Mastery 下载 http://liuyuntian.com/2006/09/29/css-mastery-download.html http://liuyuntian.com/2006/09/29/css-mastery-download.html#comments Fri, 29 Sep 2006 11:01:54 +0000 xiaoxiao http://liuyuntian.com/2006/09/29/css-mastery-download.html 　　我认为《CSS Mastery》是目前最好的一本书，当然指网站构建和CSS类的。 [lol] 新闻来源：http://www.punkprojekt.com/2006/07/28/css-mastery-dl/

　　感谢上面的同学，省了我几百大洋。其实国内最近出的一本《CSS网站布局实录》，作者不知道还在不在闪客帝国。可以在这里查看介绍http://www.blueidea.com/news/book/2006/4088.asp

　　CHINA-PUB购买：http://www.china-pub.com/computers/common/info.asp?id=32244

　　Joyo卓越购买：　http://www.joyo.com/book/detail.asp?pr…chinaui

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2006/09/29/css-mastery-download.html/feed 21 对CSS 3感兴趣的看这里 http://liuyuntian.com/2006/08/18/%e5%af%b9css-3%e6%84%9f%e5%85%b4%e8%b6%a3%e7%9a%84%e7%9c%8b%e8%bf%99%e9%87%8c.html http://liuyuntian.com/2006/08/18/%e5%af%b9css-3%e6%84%9f%e5%85%b4%e8%b6%a3%e7%9a%84%e7%9c%8b%e8%bf%99%e9%87%8c.html#comments Fri, 18 Aug 2006 12:47:54 +0000 for3w http://liuyuntian.com/2006/08/18/%e5%af%b9css-3%e6%84%9f%e5%85%b4%e8%b6%a3%e7%9a%84%e7%9c%8b%e8%bf%99%e9%87%8c.html 　　主站：　http://www.css3.info/
　　　
　　预览：　[exurl]http://www.css3.info/preview/[/exurl]

　　当然，你也可以使用[key=1]IE7 beta3[/key]查看CSS3在IE7下的表现，如果您不想安装IE7 beta3，[key=1]IE7 Beta 3 Preview Standalone[/key]这个版本也可以看一下。

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2006/08/18/%e5%af%b9css-3%e6%84%9f%e5%85%b4%e8%b6%a3%e7%9a%84%e7%9c%8b%e8%bf%99%e9%87%8c.html/feed 1 Lynda.com CSS for Designers http://liuyuntian.com/2006/06/10/lyndacom-css-for-designers.html http://liuyuntian.com/2006/06/10/lyndacom-css-for-designers.html#comments Sat, 10 Jun 2006 08:59:20 +0000 for3w http://liuyuntian.com/2006/06/10/lyndacom-css-for-designers.html

推荐一个详细的学习CSS的视频教程：Lynda.com CSS for Designers ，Lydna.com总是很快。

下载点这里：http://www.google.com/search?hl=zh-CN&q=Lynda+com+CSS+for+Designers&btnG=Google+%E6%90%9C%E7%B4%A2&lr=

1. Introduction
Welcome 0:23 2.2 MB
Chapter intro 6:09 9.3 MB
Web standards and CSS 10:53 22.4 MB
CSS goes mainstream 7:38 15.8 MB
The evolution of CSS design 8:45 17.4 MB
Into the future 9:45 13.4 MB

2. Beginning with Markup
Chapter intro 4:18 4.1 MB
Creating an XHTML document 8:51 6.3 MB
Adding semantic elements 9:06 11.4 MB
Validating and error correction 8:28 13 MB

3. How CSS Is Applied
Chapter intro 4:05 3.7 MB
Browser style 4:43 6.6 MB
User style 4:57 6.5 MB
Author style: inline 5:35 10.2 MB
Author style: embedded 5:48 11.1 MB
Author style: linked 3:52 7.8 MB
Author style: imported 6:41 13.5 MB
Inheritance 5:16 10.1 MB

4. Conflict Resolution in CSS
Chapter intro 2:19 4.9 MB
Origin and source order 8:57 11.1 MB
The important declaration 5:22 9.4 MB
Specificity (weight) 5:56 7.2 MB

5. CSS Typography
Chapter intro 2:29 1.4 MB
Using CSS to create great-looking type 20:29 34.3 MB
Combining graphics and CSS 9:40 19.7 MB
Examining image replacement 19:35 34.2 MB

6. Working with Color and Contrast
Chapter intro 2:14 2.2 MB
CSS color values 5:52 6.4 MB
Applying color to page elements 3:21 4.1 MB
Applying color to links 5:04 7.5 MB
Managing multiple link styles (descendent selectors) 4:18 6.6 MB
Creating depth of field 4:59 10.4 MB
Testing your design for color blind users 6:44 12.4 MB
Ensuring sufficient contrast 6:15 9.3 MB

7. Background Graphics
Chapter intro 1:58 1.5 MB
Adding a background image to an element 9:29 9 MB
Background repeat 7:44 14.3 MB
Background position 5:09 10.7 MB
Fixed or scroll background 4:40 9 MB

8. CSS for Navigation
Chapter intro 1:22 2.4 MB
Removing bullets or numbers from lists 6:46 9 MB
Using images for list markers 6:01 11.8 MB
Creating vertical navigation 5:08 5.8 MB
Designing a text-based horizontal navigation bar 5:10 6.5 MB
Creating a tabbed horizontal navigation bar 11:59 23.5 MB

9. CSS Floats
Chapter intro 2:06 2.1 MB
Floating columns 5:24 11.2 MB
Floating page elements 4:28 9.6 MB
Clearing floats 7:22 15 MB
Multi-column floated layout with header and footer 6:44 14.2 MB

10. CSS Positioning
Chapter intro 2:45 2.7 MB
Normal flow 3:05 6.3 MB
Relative positioning 4:32 6.5 MB
Absolute positioning 2:56 3 MB
Relative positioning to create a positioning context 5:00 7.4 MB
Fixed positioning 4:40 9.4 MB

11. CSS for Design Details
Chapter intro 1:02 2.2 MB
Making panels 8:16 14.5 MB
Creating grids 12:00 12.7 MB
Laying out products 4:45 9.2 MB

12. Designing Beautiful Data Tables
Chapter intro 2:00 4 MB
Creating table structures 5:45 5.3 MB
Adding table borders 5:02 8.2 MB
Using backgrounds in tables 4:43 5.1 MB
Special effects 7:01 14.3 MB

13. Styling Forms
Chapter intro 0:35 0.4 MB
Accessible form markup 5:22 5.3 MB
Basic fieldset styling 4:38 8.5 MB
Fieldset grid layout 2:57 5.2 MB
Styling labels and form controls 3:16 6 MB
Styling form buttons 5:12 9.3 MB

14. CSS and Design Workflow
Chapter intro 1:02 1.6 MB
Creating symbols for wireframes in Fireworks 14:57 28.1 MB
Naming conventions for class and ID 8:47 6.6 MB
Organizing your CSS document 8:11 16.5 MB
Working with multiple CSS files 5:58 6.8 MB

Conclusion
Goodbye 0:18 1.7 MB

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2006/06/10/lyndacom-css-for-designers.html/feed 0 An Overview of CSS in Dreamweaver 8 http://liuyuntian.com/2005/10/28/an-overview-of-css-in-dreamweaver-8.html http://liuyuntian.com/2005/10/28/an-overview-of-css-in-dreamweaver-8.html#comments Fri, 28 Oct 2005 11:12:09 +0000 for3w http://liuyuntian.com/2005/10/28/an-overview-of-css-in-dreamweaver-8.html 　　Macromeida在最新的文章中提到了CSS在Dreamweaver 8上的运用。

　　文章中提到了

　　一、Dreamweaver8把CSS的面板增强，把选择式的对话框集成在左侧CSS面板中，并提示了相应CSS规则。

　　二、集成了样式渲染，盒模型DIV的运用在Dreamweaver8得到很好的体现。

　　三、提倡CSS和HTML完全分离。

　　不难看出，MM在新的Dreamweaver８中把CSS提高到一个新的层次，面板集成在明显的位置，更加趋近于W3C提出的一些思想。

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2005/10/28/an-overview-of-css-in-dreamweaver-8.html/feed 0 更新了CSS http://liuyuntian.com/2005/10/11/blog-css-update.html http://liuyuntian.com/2005/10/11/blog-css-update.html#comments Tue, 11 Oct 2005 09:38:57 +0000 for3w http://liuyuntian.com/2005/10/11/blog-css-update.html 昨天收到Myraider的短信，称他的Blog已经适合了三个浏览器。于是马上改了一下，不想动了，懒了。现在我的Blog也可以在IE，FireFox，Opera下正常显示了。

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2005/10/11/blog-css-update.html/feed 0 Mozilla建议的CSS书写顺序 http://liuyuntian.com/2005/07/15/mozilla-proposed-css-written-order.html http://liuyuntian.com/2005/07/15/mozilla-proposed-css-written-order.html#comments Fri, 15 Jul 2005 09:30:59 +0000 for3w http://liuyuntian.com/2005/07/15/mozilla-proposed-css-written-order.html /* mozilla.org Base Styles
* maintained by fantasai
* (classes defined in the Markup Guide – http://mozilla.org/contribute/writing/markup)
*/
/* Suggested order:
//显示属性
* display
* list-style
* position
* float
* clear
//自身属性
* width
* height
* margin
* padding
* border
* background
//文本属性
* color
* font
* text-decoration
* text-align
* vertical-align
* white-space
* other text
* content
*
*/

相关文章

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2005/07/15/mozilla-proposed-css-written-order.html/feed 0 John.Wiley.and.Sons.CSS.Hacks.and.Filters http://liuyuntian.com/2005/07/04/johnwileyandsonscsshacksandfilters.html http://liuyuntian.com/2005/07/04/johnwileyandsonscsshacksandfilters.html#comments Mon, 04 Jul 2005 08:47:16 +0000 for3w http://liuyuntian.com/2005/07/04/johnwileyandsonscsshacksandfilters.html

列一下目录，粗略看了一下，还是有参考价值

Chapter 1:Why Hack CSS?
Chapter 2:Filtering CSS for Older Browsers
Chapter 3:Hiding CSS from Newer Browsers
Chapter 4:Applying Conditional Comments
Chapter 5:Scripting JavaScript and Document Object Model Hacks
Chapter 6:Coding Server-Side Solutions
Chapter 7:Enhancing Graphics and Media with CSS
Chapter 8:Maintaining Accessibility with CSS
Chapter 9:Integrated CSS Hack Layouts
Chapter 10:Building Navigation Systems
Chapter 11:Troubleshooting CSS
Chapter 12:Implementing CSS Hacks in Dreamweaver
Chapter 13:Creating CSS-Savvy Dreamweaver Templates

http://www.amazon.com/exec/obidos/tg/detail/-/0764579851/

Book Description

Cascading Style Sheets (CSS) is a method of describing how a Web page should look in a Web browser, but a growing number of browsers do not support CSS in the same way, forcing developers to constantly play catch-up to keep their sites consistent
Bestselling author Joe Lowery eases the pain for those Web developers who aren’t feeling the CSS love-he guides readers through real-world workarounds that will help a CSS-based site look and work the way it was meant to
Readers will grit their teeth, clench their fists, and roll their eyes for the last time once they learn how to craft fluid multi-column layouts, build interactive navigation, fix the Box Model, implement CSS hacks in Dreamweaver, and more cool tricks

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2005/07/04/johnwileyandsonscsshacksandfilters.html/feed 0 实时切换CSS样式 http://liuyuntian.com/2005/07/01/%e5%ae%9e%e6%97%b6%e5%88%87%e6%8d%a2css%e6%a0%b7%e5%bc%8f.html http://liuyuntian.com/2005/07/01/%e5%ae%9e%e6%97%b6%e5%88%87%e6%8d%a2css%e6%a0%b7%e5%bc%8f.html#comments Fri, 01 Jul 2005 13:20:14 +0000 for3w http://liuyuntian.com/2005/07/01/%e5%ae%9e%e6%97%b6%e5%88%87%e6%8d%a2css%e6%a0%b7%e5%bc%8f.html 和之间加入如下两行XHTML代码： ]]> 用W3C标准建造的网站，从理论上来说可以做到完全的表现与结构相分离。打个比方，就是可以在不动骨架（结构，XHMTL）和肌肉（行为，Javascript）的前提下，彻彻底底地换一身皮（表现，CSS）。

　　当然，换皮之前你需要先按W3C标准建好你的网站，并且为它准备两套表现不一样的CSS。“换皮”实质上就是“换CSS”，我们要做的，只是用某种方法让浏览器载入另一套CSS，重新渲染页面。方法有很多种，我就介绍最常见的三种。

方法一：什么也不干
　　啊？什么也不干？嗯，这个……准确地说是：就干那么一丁点儿 （你还真以为有这么好的事儿呀……）。

　　假设我们有两套CSS，分别封闭在两个不同的文件中：a.css和b.css。然后在和之间加入如下两行XHTML代码：

title="主题A" href="a.css" />

title="主题B" href="b.css" />　　然后用你的Firefox打开这个页面，在菜单栏中选择：查看 -> 页面风格，应该可以看到如下的“风景”：

　就这么简单，现在你就可以用Firefox来“换皮”了。IE？IE没这个功能……MS就是这么拽，W3C“明文推荐”：要求浏览器提供给用户自己选择样式表的权力，可它就不这么干。幸运的是这件事也不是太难杂，咱就代劳一下吧。

方法二：Javascript
　　在方法一的基础上，可以用Javascript的DOM方法访问link对象，再将不需要的CSS设为“禁用（disabled）”，剩下的CSS就会被浏览器用来渲染页面。脚本如下，请注意其中的注释：

　　然后在合适的地方调用这个函数，以本页为例，添加如下两个按钮：

　　试试效果：

　　使用Javascript的好处是方便、快捷、简单，缺点也是很明显的：很难做到全站的CSS切换，只能局限在当前页上。为了记忆用户的选择，可行的方案就是采用cookie。可是就算使用cookie，也需要在何时载入CSS，用户没有Javasciprt支持怎么办等问题上多做好些文章。所以不如用下面的方法——

方法三：服务器端脚本
　　毫无疑问，最好的CSS切换器应该使用服务器端脚本（PHP、ASP、JSP等）来开发。这样做的好处是很明显的：直接、高效、兼容性好、可以记忆用户选择、甚至可以组合不同的CSS实现相当复杂的“皮肤”切换。

　　我这里就用PHP为例，用其他的语言也都大同小异，对一般的开发人员来说不会有任何困难。

　　基本思路是这样：用户选择一种“皮肤”，把用户的选择记入cookie（记入数据库也一样，不过这样系统开销会大一些），用户访问网站上的任何一个页面时，再从cookie（或数据库）中读出之前用户的选择，载入相应的CSS文件（这里还是以方法一中讲到的a.css和b.css为例）。

　　创建一个名为switcher.php的文件，内容如下：

　　这段脚本先读取query数据，然后把参数style的值记入cookie，最后返回上一页。接下来我们就可以创建两个用于切换样式的链接了，并且放在合适的页面上，比如首页或用户管理后台（注意把其中的site.com换成你的域名）：

主题A
主题B　　点击任意一个链接，相应的就会把“a”或“b”记入cookie，然后就需要一段脚本来读取这个cookie值并且输出XHTML来引入对应的CSS：

title="当前选择的主题" href=".css” />　　每一个需要切换样式的页面都要加上这段代码，所以直接把它加入网站的头文件中就行了。当然你可以根据自己的需要修改这个脚本，但万变不离其宗，总的思路应该是不变的。本站就是用这种方式做的CSS切换器，你可以在首页右侧的搜索框下面找到，have a try^_^。

Copyright © 2003-2009 Xiaoxiao's Weblog All rights reserved.
]]> http://liuyuntian.com/2005/07/01/%e5%ae%9e%e6%97%b6%e5%88%87%e6%8d%a2css%e6%a0%b7%e5%bc%8f.html/feed 0