求教，给body加上了CSS，与实际情况不符！

我在ie中看了一下，body的高度为20，但为什么给body添加的css样式 background-color:#FF0000，却影响了整个背景呢。



<!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>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<style type="text/css">

html {

border:1px solid #FF0;

}

body{

border:1px solid #0F3;

   margin:100px;

   padding:0px;

   background-color:#FF0000;

   }

#dafa{

   background-color:#000000;

   }

</style>

</head>


<body>

<div id="dafa">

hello

</div>

</body>

</html>

12 个解决方案

#1

你这是想要什么效果啊？？？body添加css样式 background-color:#FF0000 。你没设置高度。当然是整个背景了，

#2

你给body添加背景当然是整个背景了

#3

在ie 的开发人员工具的现实中，我选中了body块， 显示的body实际高度是20像素，但为什么body却将整个浏览器的背景都变成红色。

#4

body就是整个页面的内容，再创建一个div包在外层

<!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>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<style type="text/css">

html {

border:1px solid #FF0;

}

#test{

border:1px solid #0F3;

   margin:100px;

   padding:0px;

   background-color:#FF0000;

   }

#dafa{

   background-color:#000000;

   }

</style>

</head>


<body>

<div id="test">

<div id="dafa">

hello

</div>

</div>

</body>

</html>

#5

如果body就是整个页面的内容，那怎么解释为什么body的实际高度是20

#6

body 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。）
我在firebog并没有看到body的实际高度是20

http://www.w3school.com.cn/tags/tag_body.asp

#7

这是我的截图你看一下是firefox 下的

#8

刚才那个图没有全部显示，这是实际的全图，我裁切了一下求教，给body加上了CSS，与实际情况不符！

#9

http://hiphotos.baidu.com/sdaiweiy/pic/item/f6ea3ac90a46f21ff1cbffe5f6246b600d33aeaf.jpg 靠，居然被屏蔽了。。。这是链接麻烦你看一下。。

#10

楼主所说的20高度应该是<div id="dafa">hello</div>这个层的高度吧，并非body的高度

#11

你并无为哪个元素设置了20PX的高度，你用IE开发工具所看到的高度，是hello撑开<div id="data"></div>之后的高度。你仔细看看2个颜色吧，有可能是你自己弄混了

#12

通过百度解决了这个问题。。。

#1