zoukankan      html  css  js  c++  java
  • div固定在屏幕底部

    项目中需要实现div一直显示在屏幕的底部,不管页面有多长或者多端都需要满足。

    在网上找的用js实现的,移动时会闪动,效果不是特别好。也可能是没找到好的。

    相比js,我更希望使用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" xml:lang="zh-CN" lang="zh-CN"> 3 <head> 4 <style type="text/css">

     5     html,body {
     6     width:100%;
     7     height:100%;
     8     margin:0px;
     9     padding:0px;
    10     overflow:hidden;
    11     }
    12     #Main {
    13     position:absolute;
    14     bottom:0px;
    15     left:0px;
    16     width:100%;
    17     height:100%;
    18     overflow:auto;
    19     z-index:1;
    20     }
    21     #ToolBar {
    22     position:absolute;
    23     bottom:0px;
    25     width:100%;
    26     height:auto;
    27     text-align:center;
    28     background:#ccc;
    29     z-index:2;
    30     overflow:hidden;
    31     }
    33 </style> 34 </head> 35 <body> 36 <div id="ToolBar">固定在页面底部不动</div> 37 <div id="Main" > 38 <div class="clear" style="height:2000px;background:#ff0;"> 我是内容,我足够大吧 </div> 39 </div></body> 40 </html>
  • 相关阅读:
    1006: [HNOI2008]神奇的国度
    1003: [ZJOI2006]物流运输trans
    Task 6.2冲刺会议六 /2015-5-19
    Task 6.2冲刺会议五 /2015-5-18
    Task 6.2冲刺会议四 /2015-5-17
    Task 6.3 场景调研
    Task 8 找水王
    Task 6.2站立会议三
    Task 6.2站立会议二
    Task 6.2站立会议一
  • 原文地址:https://www.cnblogs.com/whroid/p/3588090.html
Copyright © 2011-2022 走看看