现在很多门户网站页面内容庞大，都会往下拉很长， 在以前我们想回顶部的时候要不断往上滚动鼠标的滚轮，直到滚到顶部为止，现在如果大家细心观察右下角是不是有一个点击回到顶部的按钮呢，对， 今天我要说的就这个按钮的布局，闲话不多说，直接上代码，在代码中我尽量的标注css样式，以方便大家阅读；
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 5 <title>fixed定位，解决IE6闪动问题</title> 6 <style type="text/css"> 7 8 *html{ 9 background-image:url(about:blank); 10 background-attachment:fixed; 11 }/*此代码解决IE6.0下不会出现闪动*/ 12 13 .backgroundBox { 14 border:1px solid orange; 15 width:100px; 16 height:2000px; 17 } 18 19 .fixedBox { 20 border:1px solid red; 21 width:100px; 22 height:100px; 23 position:fixed; /*支持实现w3c标准的浏览器*/ 24 _position:absolute; /*单独针对IE6*/ 25 left:200px; /*距离顶部200px*/ 26 top:200px; /*距离右边200px*/ 27 _top:expression(eval(document.documentElement.scrollTop+200)); /*+200是IE6.0下面距离浏览器窗口顶部的位置*/ 28 /*IE6.0下面距离底部位置为0px*/ 29 /*_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));*/ 30 } 31 </style> 32 </head> 33 34 35 <body> 36 <div class="backgroundBox"></div> 37 <div class="fixedBox">fixed box</div> 38 </body> 39 40 </html>