zoukankan      html  css  js  c++  java

  • DIV+CSS自适应窗口高度

    Java代码  收藏代码
    1. <html>  
    2. <head>  
    3. <title>DIV+CSS自适应窗口高度</title>  
    4. <style type="text/css">  
    5. body {  
    6.    margin: 0;  
    7.    padding: 0;  
    8.    color: #ffffff;  
    9. }  
    10. #header {  
    11.     100%;  
    12.    height: 100px;  
    13.    margin: 0 auto;  
    14.    padding: 0px;  
    15.    background-color: #000099;  
    16. }  
    17. #wrapper {  
    18.     100%;  
    19.    margin: 0 auto;  
    20.    padding: 0px;  
    21.    background-color: #ffffff;  
    22. }  
    23. #nav {  
    24.    float: left;  
    25.     120px;  
    26.    margin: 10px 10px 10px 5px;  
    27.    background-color: #009900;  
    28. }  
    29. #content {  
    30.    margin: 10px 10px 10px 145px;  
    31.    background-color: #990099;  
    32. }  
    33. #footer {  
    34.    position: absolute;  
    35.     100%;  
    36.    height: 60px;  
    37.    bottom: 0;  
    38.    background-color: #990000;  
    39. }  
    40. </style>  
    41. </head>  
    42. <body>  
    43. <div id="header">Header</div>  
    44. <div id="wrapper">  
    45. <div id="nav">Nav</div>  
    46. <div id="content">Content</div>  
    47. </div>  
    48. <div id="footer">Footer</div>  
    49. </body>  
    50. </html>  


    当nav和content的高度大于一页的时候，不能满足这个需求，所以需要给nav和content设置min值。
  • 相关阅读:
    .NET 2.0 WinForm Control DataGridView 编程36计（一）
    Sql Server 日期格式化函数
    FastReport 金额大小写转换自定义函数
    vue.js 三种方式安装(vuecli)
    Android style
    android ui 布局性能优化
    android 手机分辨率
    TCP,IP,HTTP,SOCKET区别和联系
    android2.2 特性
    常见开放api平台OpenAPI
  • 原文地址：https://www.cnblogs.com/ranzige/p/4024293.html
Copyright © 2011-2022 走看看