怎么使div的高度自动适应页面的高度，同时div四周和页面有一定的间隔
日期：2014-05-17 浏览次数：20814 次
如何使div的高度自动适应页面的高度，同时div四周和页面有一定的间隔？
在标准模式下，css的高度是内容的高度，如果设置div的高度为100%，再设置margin为5px的话，那就超过页面的高度了！如何在保留一定间距的情况下让div的高度自动适应页面的高度呢？
------解决方案--------------------
padding: 5px;
------解决方案--------------------
try:
==============
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN "
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<meta name= "Author " content= "飘零雾雨|edzmaster@gmail.com " />
<title> test </title>
<style type= "text/css ">
body {margin:0;height:100%;}
div {margin:2%;height:96%;width:96%;background-color:#eee;}
</style>
</head>
<body>
<div> test </div>
</body>
</html>
------解决方案--------------------
lindy0101(简单最美) ( 一级(初级)) 信誉：100 2007-06-11 08:56:03 得分:0
?
设置padding的话也不能设置高度为100%了，因为height也不包括padding在内，height 100%再加上padding 5px就超出了范围了！
－－－－－－－－－－－－－－
我想这是否是兼容性问题？
推荐楼主看http://www.blueidea.com/articleimg/2007/03/4545/css2.html
一文
------解决方案--------------------
to:xdspower(杂食菜熊)
谢谢你!我正在接触那个呢:)
很详细!
建议初学都都可以去看看:)
------解决方案--------------------
不用百分比。
在标准模式下，css的高度是内容的高度，如果设置div的高度为100%，再设置margin为5px的话，那就超过页面的高度了！如何在保留一定间距的情况下让div的高度自动适应页面的高度呢？
------解决方案--------------------
padding: 5px;
------解决方案--------------------
try:
==============
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN "
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<meta name= "Author " content= "飘零雾雨|edzmaster@gmail.com " />
<title> test </title>
<style type= "text/css ">
body {margin:0;height:100%;}
div {margin:2%;height:96%;width:96%;background-color:#eee;}
</style>
</head>
<body>
<div> test </div>
</body>
</html>
------解决方案--------------------
lindy0101(简单最美) ( 一级(初级)) 信誉：100 2007-06-11 08:56:03 得分:0
?
设置padding的话也不能设置高度为100%了，因为height也不包括padding在内，height 100%再加上padding 5px就超出了范围了！
－－－－－－－－－－－－－－
我想这是否是兼容性问题？
推荐楼主看http://www.blueidea.com/articleimg/2007/03/4545/css2.html
一文
------解决方案--------------------
to:xdspower(杂食菜熊)
谢谢你!我正在接触那个呢:)
很详细!
建议初学都都可以去看看:)
------解决方案--------------------
不用百分比。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
