61,112
社区成员
发帖
与我相关
我的任务
分享为什么我设置了html和body的高度都是100%，内容却不能铺满？
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
*{
margin: 0;
padding: 0;
}
html,body{
height: 100%;
}
#color {
height: 100%;
background-color: #f69;
}
body{
border: 10px solid;
}
</style>
</head>
<body id="div1">
<div id="color">
<p>你好</p>
</div>
<img alt="" src="img/no1.jpg">
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
*{
margin: 0;
padding: 0;
}
html,body{
height: 100%;
}
#color {
height: 100%;
background-color: #f69;
}
body{
border: 10px solid;
}
</style>
</head>
<body id="div1">
<div id="color">
<p>你好</p>
</div>
<img alt="" src="img/no1.jpg">
</body>
</html>
...全文
请发表友善的回复…
发表回复
MMMMaki 2016-10-26
- 打赏
- 举报
img设置width：100%
於刚 2016-10-25
- 打赏
- 举报
你可以搜下height的值，html和body的height设置为100%是没有效果的，height=100%是继承父元素的高度，
html和body的本身就是根元素，父元素，自然通过height=100%来铺满窗口，你希望给body铺满窗口，要么设定固定的height，要么用js获取页面高度，在赋值给body，如果希望body根据内容高度，自动扩展，无须设置height。
KK3K2005 2016-10-09
- 打赏
- 举报
<!DOCTYPE html>
现在就这样写吧
qq_35190761 2016-10-09
- 打赏
- 举报
<body id="div1" >
<div id="color" align="center";>
<p>你好</p>
<img alt="" src="1.bmp" width="50%" height="50%" >
</div>
</body>
html背景色会遮盖body背景，看不见body颜色。
http://blog.csdn.net/javaloveiphone/article/details/51098972
123456123567 2016-04-06
- 打赏
- 举报
border属性是为了区分body的大小，这里是img超出了body的范围，不知道为什么body不能把img容纳进去。还有就是想在最外面也就是html添加一个背景色，body设置成白色。这样
hookee 2016-04-05
- 打赏
- 举报
测试了下好像没什么问题啊，内容铺满是什么意思？ html body 100% 和 内容没啥关系吧
ZiglarXie 2016-04-05
- 打赏
- 举报
为啥还有个border属性
life is wonderful 2016-04-05
- 打赏
- 举报
去掉你添加的boder属性
daswcszxw 2016-04-05
- 打赏
- 举报
因为你给body加了border
去掉
body{
border: 10px solid;
}
