首页 > 网站 > WEB开发 > 正文

DIV+CSS自适应窗口高度

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

当nav和content的高度大于一页的时候，不能满足这个需求，所以需要给nav和content设置min值。

上一篇：可供前端工程师选择的精彩CSS框架

下一篇：浅析inline-block--使用inline-block创建布局

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表
学习交流
更多

硬盘分区如何设置准确的分区空间

硬盘分区如何设置准确的分区空间...
热门图片
更多
猜你喜欢的新闻
猜你喜欢的关注

新闻热点

英伟达市值一夜大涨9246亿 创2023年5月以来最大单周涨幅
2024-04-27 13:35:46
雷军：小米正在申请3万件专利，以提升自身的竞争力
2024-04-27 13:33:47
人参泡酒15年后竟“复活”？网友：这酒还能喝不？
2024-04-24 22:53:44
芯片股普涨！英伟达市值一夜大涨6000亿元
2024-04-23 19:32:50
面馆老板1天卖100碗刚够交房租 要卖到150碗才能实现盈利
2024-04-23 19:25:50
跌近30%！茶百道上市一小时跌没3年净利润
2024-04-23 19:13:19

疑难解答

图片精选

网友关注

关于本站 - 网上投稿 - 商务合作 - 隐私政策 - 网站地图
Copyright © 2008 - 2024 VEVB.COM. All Rights Reserved.武林网 版权所有