<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS布局：div高度随窗口变化而变化</title>
<style>
* {margin:0px;}
html {height: 100%; }
body {height: 100%; }
div { margin:0 auto;}
#top { width:800px; min-height:100%; background-color:#00f;}
*html #top {height:100%; background-color:#f00;}
*html body {height:100%; }
#topz{ width:800px; height:60px; background:#ddd;}
#topx{ width:800px; height:50px; background:#ccc;}
</style>
</head>
<body>
<div id="top">
    div高度随窗口变化而变化。
</div>
<div id="topx">
    <h2>中国最大的中文搜索引擎。</h2>
</div>
</body>
</html>

CSS布局：div高度随窗口变化而变化(BUG会有滚动条)的更多相关文章

  1. 纯CSS实现Div高度根据自适应宽度（百分百调整）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. CSS布局之-高度自适应

    何为高度自适应? 高度自适应就是高度能跟随浏览器窗口的大小改变而改变,典型的运用在一些后台界面中上面一栏高度固定用作菜单栏或导航栏,下面一栏高度自适应用于显示内容.高度自适应不像宽度自适应那样简单,在 ...

  3. css中div高度自适应

    高度的自适应(父div高度随子div的高度改变而改变) 1.如果父div不定义height.子div均为标准流的时候,父div的height随内容的变化而变化,实现父div高度随子div的高度改变而改 ...

  4. CSS实现div高度自适应

    1.有时候,我们希望容器有一个固定高度,但当其中的内容多的时候,又希望高度能够自适应,也即容器在纵向能被撑开,且如果有背景,也能够自适应.在一般情况下,使用min-height即可解决.但是广大网民的 ...

  5. CSS未知div高度垂直居中代码_层和布局特效

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. div高度自适应窗口高度布局

    给body和html都设置height:100%:然后子元素用百分比设置高度

  7. CSS布局-body高度不等于页面高度

    记录采坑: 博客记录问题,用作回忆用,不喜勿喷! html,body{width: 100%; height: 100%}这是初始定义的宽高.在布局越写越复杂的时候,布局很容易出现问题,例如一个页面中 ...

  8. css布局------上下高度固定,中间高度自适应容器

    HTML <body> <div class="container"> <div class="header"></d ...

  9. 纯Css实现Div高度根据自适应宽度（百分比）调整

    在如今响应式布局的要求下,很多能自动调整尺寸的元素能够做到高宽自适应,如img,通过{width:50%;height:auto;}实现图片高度跟随宽度比例调整. 然而,用的最多的标签一哥Div却不能 ...

随机推荐

  1. iOS应用架构浅谈

    (整理至http://www.cocoachina.com/ios/20150414/11557.html) 缘由 从事iOS工作一年多了,主要从事QQ钱包SDK开发和财付通app维护,随着对业务的慢 ...

  2. 【贪心】CSU 1809 Parenthesis (2016湖南省第十二届大学生计算机程序设计竞赛)

    题目链接: http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1809 题目大意: 给一个长度为N(N<=105)的合法括号序列.Q(Q<= ...

  3. 怎么添加项目到SVN上面

     一.通过SVN客户端向服务器上面添加项目 1.在服务器上面创建一个文件夹,文件夹以项目名称命名. 2.在合适目录下右击后,点击SVN Checkout,将你在服务器上面创建的目录checkout下来 ...

  4. Remove Duplicates from Sorted List II ——LeetCode

    Given a sorted linked list, delete all nodes that have duplicate numbers, leaving only distinct numb ...

  5. GitHub上传不了的解决 ssh: connect to host github.com port 22: Bad file number git did not exit cleanly (exit code 128)

    问题情况 本来一直用的是github的客户端,结果现在上传的时候出问题了,去网站上看,新项目已经创建,但是代码却怎么都上传不上去.于是只好用命令行的方式解决. Tortoisegit上是这样说的: g ...

  6. ubuntu server 14.04 vncserver with gnome

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAvkAAAGdCAIAAAAHU/v+AAAgAElEQVR4nO3dv4skR5738fsX8g+Zf0

  7. RabbitMQ-死信(Dead Letter)

    对于有异常的消息我们可以有如下做法: 记录下来再ack. nack或者reject,同时将requeue设为false. 在第2条的基础上增加死信(Dead Letter).   上边的第3个做法可以 ...

  8. Android注解利器：ButterKnife 的基本使用

    前言 ButterKnife 简介 ButterKnife是一个专注于Android系统的View注入框架,可以减少大量的findViewById以及setOnClickListener代码,可视化一 ...

  9. mysql5.5 对触发器,函数,存储引擎,事件进行主从复制情况.(转)

       mysql5.5 对触发器,函数,存储引擎,事件进行主从复制情况. 转(http://blog.csdn.net/m582445672/article/details/7670802) 一.My ...

  10. [置顶] C语言单元测试框架

    unitest.h /****************************************************************************** * * * This ...