读《精通CSS：高级Web标准解决方案》

    由于最近在看《精通CSS:高级Web标准解决方案》，作了一些记录。

---

  由于不少开发人员对于XHTML2的开发不满，因而出现了WHATWG和W3C的分裂，WHATWG决定开发本身的规范，也就是HTML5,而W3C的XHTML2标准已被放弃，HTML5成为了W3C的正式标准。XHTML和HTML的区别就是XHTML严格遵照XML编码规定，浏览器会依据文档的MIME 类型来解析文档，若是不遵循规范会致使错误，而HTML倒是很宽松的。

     Doctype类型和浏览器模式，DTD（文档定义类型）是一组机器可读的规则，它们定义XML或HTML的特定版本中运行有什么，不容许有什么。浏览器会对页面进行相应的措施，并决定采起何种行为。浏览器会经过分析页面的Doctype来了解使用哪一个DTD。

 

添加在全部站点上都使用的经常使用规则，造成某种原型CSS文件，这能够节省更多的时间。

 

模式组合是一个页面或一系列页面，他们使用当前的样式表显示站点上可能吸纳时的每种样式排列组合，从标题级别和文本样式直到特定的内容和布局类型。

 

最基本的样式指南应该描述通常性设计指南，好比rue处理标题和其余排版元素，网格结构的设计方式是什么，以及使用哪一个调色板。

 

IE7和更低版本不支持在除连接以外的其余元素上使用伪类选择器，可是全部现代浏览器都支持。

 

连接应该只用于get请求，决不要用于post请求。

 

把表单反馈信息写在label标签里，而后绝对定位更好？

 

CSS框架试图经过在标记和表现之间创建强耦合来简化CSS布局，可是这种耦合正式咱们抛弃基于表格布局的主要缘由。

 

要想建立可伸缩且容易维护的CSS相同，首先应该检查设计，寻找重复的模式，这包括页面结构中的模式或在站点中等元素反复出现的方式。在这个阶段，不该该太关注表现方式，而是应该注意结构和意义。

1，先把页面划分为大的结构性区域，好比容器，页眉，页面区域和页脚。

2，而后注意力转移到内容区域自己，开始创建网格结构。寻找共同的特征而不是视觉表现。

3，而后在各个区域中寻找不一样的布局结构，是否想要把某些信息分红两列，三列或四列。

4，结构设计完以后，如今能够开始关注不一样类型的内容。给每一个内容块起一个有意义的名称，而后分析他们的关系。

5，查看每一个内容块的结构，看看不一样的类型中是否有共同的模式，不如公告和新闻其实和同样的。

6，找出模式并肯定命名约定以后，最好立刻开始定义将使用的元素，这是有好处的。

 

混杂模式中IE5.x和IE6不支持margin:auto声明，IE能够设计text-align：center肯定居中，

 

用CSS进行布局有集中不一样的方式，包括绝对定位和使用负的外边距。

 

为了提升可访问性，我选择在源代码中将祝内容区域放在次要内容区域的前面，这深深考虑到了屏幕阅读器，由于屏幕阅读器不用再通过不重要的内容，到达主内容部分。

 

在全部浮动元素中添加display:inline。这个预防措施用来防止IE中的外双边距产生的bug.

 

这两个元素嵌套在contetn元素中，能够建立关联，我利用了这个事实，这有两个好处。首先不须要为要应用的每一个元素建立新的类名，而应使用层叠找到元素。

 

利用浮动包含浮动，从而简化清除浮动这一步，简直赞。

 

若是选用某个框架，你可能会在每一个项目中都使用它，所以思惟方式极可能会逐渐僵化。正如俗话所说的，若是你只有一把锤子，那么是那么东西看起来都是钉子。

 

这个工具箱能够包含全局reset,排版样式和表单处理，以及登陆表单，日历表格和导航列表等经常使用HTML组建的标记模式。

 

最多见的CSS问题并不是来自源于浏览器BUG，而是来源于对CSS规范的理解不完整。

 

IE的开发节奏比其余浏览器慢得多。

 

reset样式表能够避免和缓解HTML元素默认样式不一致的问题，跨全部浏览器一个一致的舞台。

 

我很是喜欢采用最小宽度和最大宽度的流式设计。

 

网格一般有预先肯定的宽度，包含指定数量的列和可选的隔离带。网格是你最好的朋友，能够帮助你克服困难。它是Photoshop和CSS之间的的“中间人”，能够帮助你作出浮动，定位，外边距，内边距，边框等相关的初步定位决定。