常用CSS效果

div水平居中margin:0px auto;在IE下可能不能正常显示，原因DTD说明未正确使用：http://www.itokit.com/2012/0629/74547.html

文字围绕图片： 图片float:left，或float:right

文字
围绕图片

div内文字居中  lineheight的高度和div的高度相同（注意，文字不能换行），IE6+

div内文字居中

多行文字居中显示，使用display:table-cell;vertical-align:middle，兼容IE8+

div内多行文字居中
第二行
第三行

文字和图片同一行时，让文字局中或顶部显示：设置图片vertical-align:middle/top，IE6+

文字在图片中央

多个div在同一行显示 1.使用float属性IE6+,需要清理部分，2使用display inline-block，IE8+，3.使用display inline-block;zoom:1,*display:inline,IE6+

CSS hack

1. 大部分特殊字符IE浏览器支持，其他主流浏览器firefox，chrome，opera，safari不支持 (opera可识别除外)。
2. \9      ：所有IE浏览器都支持
3. _和-  ：仅IE6支持
4. *        ：IE6、E7支持
5. \ 0   ：IE8、IE9支持，opera部分支持
6. \9\ 0  ：IE8部分支持、IE9支持
7. \ 0\9  ：IE8、IE9支持

element{
color：#666\9； //IE8 IE9
* color：#999；   //IE7
_color:#EBEBEB； //IE6
}

栅格系统实践

自制栅格

Bootstrap

Blueprint

？？

响应式网站实践