zoukankan      html  css  js  c++  java
  • 实现三行布局页面自适应不同分辨率下的屏幕高度

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    <META http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style>
    *
    { margin:0; padding:0; }
    #pageHead
    { background-color:#CC00FF; height:100px; }
    #pageBody
    { background-color:#9966CC; }
    #pageFoot
    { background-color:#996666; height:50px; }
    </style>
    </HEAD>
    <BODY style='overflow:hidden;' onload='get_height();'>
    <div id='pageHead'>Head</div>
    <div id='pageBody' style='overflow:auto;'>Body<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></div>
    <div id='pageFoot'>Foot</div>
    <script>
    function get_height(){
    var page_height = document.body.clientHeight;
    var head_height = document.getElementByIdx_x('pageHead').clientHeight;
    var foot_height = document.getElementByIdx_x('pageFoot').clientHeight;
    document.getElementByIdx_x(
    'pageBody').style.height = page_height - head_height - foot_height;
    }
    window.onresize
    = get_height;
    </script>
    </BODY>
    </HTML>
  • 相关阅读:
    从汇编看c语言函数调用
    安家之由
    算法设计新思路
    AcceptsReturn
    silverlight 导出DataGrid 数据到Excel
    siliverlight双击事件
    如何:以编程方式调用按钮的 Click 事件 (Visual C#)
    左连接出错
    C# 根据当前时间获取,本周,本月,本季度等时间段
    验证用户登陆
  • 原文地址:https://www.cnblogs.com/xiongbaobao/p/2393448.html
Copyright © 2011-2022 走看看