zoukankan      html  css  js  c++  java
  • 固定导航(Sticky nav)

    方法1:

    <div class="footer">
    </div>

    .footer{
      position:fixed;
      bottom:0;
      left:0;
      100%;
      _position:absolute;
      _top:expression(documentElement.scrollTop + documentElement.clientHeight - this.offsetHeight);
      overflow:visible;
    }

    方法2:

    CSS Sticky Footer,出自:http://www.cssstickyfooter.com/using-sticky-footer-code.html

    <div id="wrap">
      <div id="main">
      </div>
    </div>
    <div id="footer">
    </div>

    * {margin:0;padding:0;}
    html, body {height: 100%;}
    #wrap {min-height: 100%;}
    #main {overflow:auto;padding-bottom: 180px;}
    #footer {position: relative;margin-top: -180px;height: 180px;clear:both;}
    /*Opera Fix*/
    body:before {
      content:"";
      height:100%;
      float:left;
      0;
      margin-top:-32767px;
    }
    <!--[if !IE 7]>
    <style type="text/css">
      #wrap {display:table;height:100%}
    </style>
    <![endif]-->

    此两种方法亦可用于顶部的导航。

  • 相关阅读:
    决策树理解
    堆排序
    glove理解
    PHP图片水印类
    宝塔nginx安装rtmp模块实现推拉流
    nginx安装配置
    结构体,位域,共用体
    指针
    升级mac Catalina版本后无操作权限
    脚本连接linux服务器
  • 原文地址:https://www.cnblogs.com/mengff/p/5183109.html
Copyright © 2011-2022 走看看