我对CSS的了解少之又少，还好公司有美工，非常精通这些。但偶尔在自己写的时候可就没有人帮助了。所以，看到点资料，都会想着记下来。。
想来司徒正美的英文比我好多了，他还能经常去国外的网站，我就不行。。。
以下就来自他的博客了：
逛mootools核心成员Thomas Aylott的 博客看到，不过有点标题党了，实际效果并没有那么灵光，只是定义四个类，分别用来固定视口的上下左右。很遗憾，它无法解决与 top,bottom,left,right并用的问题（见例子）。它利用到IE8已经废弃的expression来计算页面的大小，从而固定我们想固定 的元素。里面用到一技巧，就是给html或body元素添加一张背景图片，并设置background-attachment:fixed，用于强制在页 面重绘之前执行CSS，也就是执行它里面的expression。另，我们也不需要一张真的图片，我们给它一个about:blank命令就可以，就像平 时对付链接一样，仅仅就是想要一个hover效果非得塞给它一个href。
CSS代码
- .fixed-top {position:fixed;bottombottom:auto;top:0px;}
- .fixed-bottombottom {position:fixed;bottombottom:0px;top:auto;}
- .fixed-left {position:fixed;rightright:auto;left:0px;}
- .fixed-rightright {position:fixed;rightright:0px;left:auto;}
- * html,* html body {background-image:url(about:blank);background-attachment:fixed;}
- * html .fixed-top {position:absolute;bottombottom:auto;top:expression(eval(document.documentElement.scrollTop));}
- * html .fixed-rightright {position:absolute;rightright:auto;left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth-(parseInt(this.currentStyle.marginLeft,10)||0)-(parseInt(this.currentStyle.marginRight,10)||0)));}
- * html .fixed-bottombottom {position:absolute;bottombottom:auto;top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
- * html .fixed-left {position:absolute;rightright:auto;left:expression(eval(document.documentElement.scrollLeft));}
原文来自于：http://www.cnblogs.com/rubylouvre/archive/2009/11/14/1603113.html
