1、应该将 CSS 放置于结构的上方（一般放置于 head 元素内）。CSS 是解释型语言，Firefox 和 IE 在等待 CSS 传输完成之前不会渲染任何东西。只有将 CSS 前置，才可在浏览器解析结构时，对页面进行渲染。
This causes the blank white screen problem. The page is totally blank until the stylesheet at the bottom is downloaded, on the order of 6-10 seconds for this page. The browser is waiting for the stylesheet to be loaded before it renders anything [...]
IE8 (下文中的 IE8 暂时仅代表IE8 beta1) 中增加了 CSS3 中的子串匹配的属性选择器（substring matching attribute selectors），具体规则与正则中的匹配很相似：
E[att^='val'] //子串以’val’ 开始
E[att$='val'] //子串以’val’ 结束
E[att*='val'] //子串中包含’val’
IE8 支持绝大多数基本的 CSS2.1 选择器：
:before and :after 被支持，只支持文本，不支持图片，但还存在bug 。
:focus 被支持。
display: inline-block 被支持（只能用于内联元素）。
display: table 被支持。
list-style 完全被支持，包括值 upper-greek （此值其他浏览器均未支持）。
outline 被支持。
border-collapse, border-spacing 和 caption-side 被支持。
white-space 完全被支持。
box-sizing 被支持，不过使用的是私有属性 -ms-box-sizing 。
不支持的包括但不限于... 13 条评论 »
//显示属性
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
1、连续的英文或数字能是容器被撑大，不能根据容器的大小自动换行。解决方法：《css之自动换行》 。连续的标点符号也不会转行，用属性 word-break:break-all; 无法达到效果，可以选用属性 word-wrap: break-word; 来解决！
2、有序列表的 li 在 IE 中，定了宽后，序号就变为1；定了浮动后，就没有了序号，Firefox 却不同。IE 认为：列表本来就不把序号算在实体内。
3、根据 CSS1，class 或 id 属性的值不能以数字 (0-9) 开头。更早版本的 Internet Explorer 允许这些值以数字开头。
4、在用 :after 方式清除浮动时，GBK 编码下切记不要在 content:””; 的引号中加任何字符，包括网上常见方式的点“.”，在opera下会产生问题。
div:after {
content:”";
display:block;
clear:both;
visibility:hidden;
height:0;
}
5、 opera 不支持 overflow... 3 条评论 »
很早在 蓝色论坛 做过一个调查《你使用的CSS命名规则 (单选) 》，调查结果如下（参与投票人数为83人）：
helloworld 2 (2.41%)
hello-world 9 (10.84%)
hello_world 52 (62.65%)
helloWorld 19 (22.89%)
HelloWorld 1 (1.20%)
其他 0 (0.00%)
从结果中可以看出使用率最好的为下划线命名法（ hello_world ），其次为骆驼式命名法（helloWorld），再次为连接符命名法（ hello-world）。而在其他语言中比较常见的帕斯卡（pascal）命名法、匈牙利命名法等在 CSS 的命名规则中则很少有人使用。
调查的最终结果并不能说明谁的对错，只是体现一种偏好。但更多人对某种的偏好，其实同时也更体现出其在某些地方的突出。仅为初学者入门提供了更好的选择。
偏好是自己的，“走自己的路，让别人去说吧”，嘿嘿……
对于相同的结构，我们可以通过CSS来创造出40种不同的布局，可以从中学到布局的很多知识，也可以体验出CSS的强大和标准的便捷。
http://blog.html.it/layoutgala/
margin 在中文中我们翻译成外边距或者外补白（本文中引用外边距）。他是元素盒模型（box model）的基础属性。
一、margin的基本特性
margin 属性包括 margin-top, margin-right, margin-bottom, margin-left, margin，可以用来设置 box 的 margin area。属性 margin 可以用来同时设置 box 的四边外边距，而其他的 margin 属性只能设置其自各的外边距。
margin 属性可以应用于几乎所有的元素，除了表格显示类型（不包括 table-caption, table and inline-table）的元素，而且垂直外边距对非置换内联元素（non-replaced inline element）不起作用。
或许有朋友对非置换元素（non-replaced element）有点疑惑，稍微帮助大家理解一下。非置换元素，W3C 中没有给出明确的定义，但我们从字面可以理解到，非置换元素对应着置换元素（replaced element），也就是说我们搞懂了置换元素的含义，... 6 条评论 »
表达方式：+property:value
测试环境：IE5，IE6 ，IE7，FF1.5，FF2.0，Opera 9，Safari 2
测试结果：IE5，IE6 ，IE7浏览器识别；FF2.0，Opera 9，Safari 2浏览器不识别。
结论：我们可以用”+”来实现只有 IE 识别的 CSS Hack。
比如我们要实现在 IE 中 480px 的宽度，而在其他浏览器 500px 的宽度，就可以通过 “+” Hack 来完成，如下：
#hack {
width:500px;
+width:480px; /*only IE*/
}
这应该归结于IE对一些特殊字符的识别，大家还可以测试其他的特殊字符如：” >”,”-”,”@”……或许有更多的收获。
PS：可能有朋友想到 “_” Hack ，但它们是由区别的，因为IE7中是不识别“_”的。
扩展阅读：《Internet Explorer 7 CSS hacks》
学习标准的朋友，一般都会在学习的过程中接触到CSS滑动门技术，或许大家也都看过这篇文章《CSS中的滑动门技术》，如果你还没接触过或还没看过上文或有点忘记内容，也没关系，可以点击上面的文章链接，先了解或温习一遍。
在《CSS中的滑动门技术》一文中的滑动门例子，大家仔细实验，或许已经发现，链接区有9像素的盲点无法点击，而且在IE下，只能点击文字部分大小，不能点击整个按钮区块。而我们或许期望的是整个按钮区块都可以点击，并且不允许有盲点存在。
那我们又该如何去实现呢？下面我们一起来探讨一些解决方法：
首先为了方便我们先把《CSS中的滑动门技术》中的代码移过来：
XHTML部分：
<div id=”header”>
<ul>
<li><a href=”#”>Home</a></li>
<li id=&#... 2 条评论 »
html, address,
blockquote,
body, dd, div,
dl, dt, fieldset, form,
frame, frameset,
h1, h2, h3, h4,
h5, h6, noframes,
ol, p, ul, center,
dir, hr, menu, pre { display: block }
li { display: list-item }
head { display: none }
table { display: table }
tr { display: table-row }
thead { display: table-header-group }
tbody { display: table-row-group }
tfoot { display: table-footer-group [...]
：