《CSS 禅意花园》读书笔记1

最近有点忙..但有的事情开始写博客就不能停下来.

<<CSS 禅意花园>>读书笔记1(基础篇---------上)

在假期中买一本<<CSS 禅意花园>>，感觉确实一本好书，我很认真的看完并做下笔记，对我自己有很大帮助，现在和大家分享。
这是一本介绍www.csszengarden.com这个站点上优秀网页设计并讲解在网页设计中的要领，csszengraden是提供一个固定的页面内容来让众多网页设计大师们来一展才华，上穿自己的CSS模版的站点，这本书与其他不同之处是在于它是先给一个完整的成功案例，并将里面最新颖的设计提出来讲解，让人从总体去考虑CSS的使用，真正的使人能从大局考虑一个页面的整体设计样式，当然还有其他优点,如提很多学习资料等。。。。

一：禅意花园的站点www.csszengarden.com。

站点的作用：1：布局出问题时，2:新的CSS效果，3:在不同的浏览器中兼容问题，4:说服雇主使用Web标准设计页面时 5:没有好的创意时 6：创意平台

二：基础篇快记。

（1）DOCTYPE：（文档类型），可以让浏览器和其他用户理解你用的HTML语言类型。

（2）在设计中尽量少使用标记。

（3）需要编写文档，并保持它的稳定性。
 
（4）提供一个全球化参考http://www.joelonsoftware.com/articles/Unicode.html
 
(5) IE 中样式短暂失效果问题  http://www.bluerobot.com/web/css/fouc.asp/

(6) 标记<arronym></arronym>:表示取首字母的缩写词。
 我再推荐几个：<cite></cite>用斜体显示标明引文；<dfn></dfn>表示术语的定义；<del> 文字当中划线表示删除 ；<ins> 文字下划线表示插入 ；<sub> 下标 ；<sup> 上标 ；<blockquote>缩进表示引用； <pre>保留空格和换行； <code>表示计算机代码，等宽字体；

（7）印刷字体清单：http://www.alistapart.com/articles/emen/
 
(8) 设计时候，应该负责，应该支持多浏览器；这里提供检测地址：www.cgnthiasays.com

（9）快捷件问题： （Accesskey）(http://www.wats.ca/orphans.php)

(10)查看源代码方法 ：（这里是防止被查看的方法：http://www.webjx.com/htmldata/2007-07-13/1184294167.html）

(11)检测服务地址：（www.cynthiasays.com）

（12）<div id="extraDiv"><span></span></div>可以让我们向里面动态的添加东西；

（13）灵活性
 
  在CSS1中 #quickSummary p{color:red};(我想大家都知道)；
  在CSS2中 #quickSummary >p + p {color:red};(而这个是超过两个以上的<p>标记的被控制)
                 #quickSummary >p+ p+ p {color:red};(超过两个以上的<p>标记的被控制)
  在CSS3中 #quickSummary p:nth-child(3);(第一个出现的 P 为基础，只要是“3”的倍数的全部 P 都会被控制)
 
  再为大家补充：
                 p:nth-child(2) { color:red; };（第一个出现的 P 为基础,偶数被控制）
 
  那再看这个：
                 tr:nth-child(2) { background:red; }；（第一个出现的 tr 为基础,偶数tr被控制）
 
                 p:last-child { background:red }(在 p 之前的一个 p 被控制)

                 :not(p) { border:5px solid red; }(自身不被控制)
  还要更多可以到www.w3.org/TR/2005/WD-css3-selectors-20051215/（14）一个CSS 选择器工具；

  我推荐这篇文章：http://soft.yesky.com/102/2698102.shtml

(15)更小的文件:30k文件----------- 10k js        这一部分是被先执行。
        -- 10k css       这一部分被缓存在浏览器中。
       -- 10 html

(16)要注意设计中对移动设备的支持。
  这里有的小资料：移动Web最优方案工作组对默认交付内容（Default Delivery Context）进行了规定：
    屏幕宽度   最小120 pixels
    标记语言   XHTML Basic Profile
    字符编码   UTF-8
    图片格式   JPEG、GIF 89a （非交错模式、非透明、非动画）
    最大页面   20 Kb
    色彩范围   适合网络使用, 比如红/绿/蓝三色的值仅能从0、51、102、  153、204以及255中选择
    风格表单   External CSS Level 1
    HTTP版本 HTTP/1.0.
  看来样式要用CSS 1.
  
（17）XHTMl 和 MIME 类型
  MIME 类型：applicaton/xhtml+xml
  XHTML 特性清单 ：http://www.w3.org/1999/xhtml/
       http://www.w3cn.org/webstandard/xhtml/2004/65.html

基础篇分上下两部分，"上"主要是笔记和提供关键知识的与扩充，下主要是对主要部分的讲解和部分英文资料的翻译，上面有很资料,大家可以去看;<<CSS 禅意花园>>这本书本来就是为懂得CSS基础之上的设计者做为提高实践所用，所以基础篇要还有下部分有的内容还需要深入的谈！下次见.

如有什么问题请指正。。。谢谢

-----------------------------------------------------works guo--------------------------    
  

转载于:https://www.cnblogs.com/worksguo/archive/2007/10/20/931508.html