腾讯微博和空间QQ的顶部浮动怎么实现的（如图）

在滚动网页时，顶部的有一块始终是不动的。不知道是如何实现的？除了CSS可以写以外，还有其它的语言可以实现这样的功能吗？QQ空间是怎么实现的？我很想知道，那位大哥给我解惑一下，小弟在这里感谢你们了。我这里插不了图，如果有图估计看的更清楚。

解决方案 »

  1.   

    固定层共有2个要点：position:fixed;/absolute;
    top:0;fixed有的不支持
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <meta http-equiv="Content-Type" content="textml; charset=utf-8" />
        <title></title>
        <style type="text/css">    #main{
        font-family:verdana, sans-serif;
        font-size:small;
        height:1000px;
        }
    #guding{
        position:fixed;
    top:0;        _position:absolute;
        _margin-top:0;
        width:100%;
        background:red;   
        }
        #content{
            margin-top:20px:;
        }
        </style>
       
        </head>
        <body>
            <div id="main">
               <div id="guding">这里是不变的。</div>
               <div id="content"> <p>a这里会变的</p>
            <p>b这里会变的</p>
            <p>c这里会变的</p>
            <p>d这里会变的</p>
            <p>e这里会变的</p>
            <p>f这里会变的</p>
    </div>
    </div>
        </body>
        </html>
       
      

  2.   

    #bar_info{ position:fixed; left:0; bottom:0; width:100%; height:50px; background:#000; _position:absolute; _bottom:auto; _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
    此代码兼容ie6
      

  3.   

    QQ空间用的是position:fixed;但这个属性IE6不支持，所以如果你用IE6打开QQ空间的话，你会发现顶部的那个东西并不固定，这也就是所谓的降级处理，我个人很支持这种做法，对于IE6的用户，只做最基本的支持