zoukankan      html  css  js  c++  java
  • I6下实现FIXED

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
    /*让position:fixed在IE6下可用! */ .fixed-top /* 头部固定 */ {
    position:fixed;
    bottom:auto;
    top:0px;
    }
    .fixed-bottom /* 底部固定 */ {
    position:fixed;
    bottom:0px;
    top:auto;
    }
    .fixed-left /* 左侧固定 */ {
    position:fixed;
    right:auto;
    left:0px;
    }
    .fixed-right /* 右侧固定 */ {
    position:fixed;
    right:0px;
    left:auto;
    } /* 上面的是除了IE6的主流浏览器通用的方法 */
    * html, * html body /* 修正IE6振动bug */ {
    background-image:url(about:blank);
    background-attachment:fixed;
    }
    * html .fixed-top /* IE6 头部固定 */ {
    position:absolute;
    bottom:auto;
    top:expression(eval(document.documentElement.scrollTop));
    }
    * html .fixed-right /* IE6 右侧固定 */ {
    position:absolute;
    right: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-bottom /* IE6 底部固定 */ {
    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)));
    background:#f00;
    100%;
    }
    * html .fixed-left /* IE6 左侧固定 */ {
    position:absolute;
    right:auto;
    left:expression(eval(document.documentElement.scrollLeft));
    }
    </style>
    </head>

    <body>
    <div style="height:500px;background:#ccc;">
    </div>
    <div class="fixed-top">top</div>
    <div class="fixed-right">right</div>
    <div class="fixed-left">left</div>
    <div class="fixed-bottom">bottom</div>
    </body>
    </html>

  • 相关阅读:
    CentOS 6.x 系统安装选项说明
    MySQL表的操作
    6月13号
    6月11号
    6月10号
    6月9号
    6月6
    day27
    day 28
    day 29
  • 原文地址:https://www.cnblogs.com/webzhangnan/p/2524460.html
Copyright © 2011-2022 走看看