期末作业，要求用css+div完成一个首页！我自己写的首页页面代码（body部分）如下 <body>
<div id="container"><!--网页盒子-->
<div id="header">header<!--页面头部-->
</div>
<div id="pageBody"><!--页面主体盒子-->
<div id="leftside">leftside<!--页面左侧内容-->
</div>
<div id="righttop">righttop<!--页面右侧上部内容-->
</div>
<div id="contact">contact<!--页面右侧联系方块-->
</div>
<div id="footer">footer<!--页面底部-->
</div>
</div>
</div>
</body>下面是css的代码/*基本信息*/
body {
font:12px;
Tahoma;margin:0px;
text-align:center;
background:#FFF;
}
/*网页盒子*/
#container {
width:100%;
background:#CCC;
}
/*页面头部*/
#header {
float:none;
width:800px;
margin:0 auto;
height:100px;
background:#FFCC99;
}
/*页面主体盒子*/
#pageBody {
width:800px;
margin:0 auto;
height:800px;
background:#CCFF00;
}
/*页面主体左侧*/
#leftside {
float:left;
width:50%;
margin:0 auto;
height:800px;
background:#ffcc00;
}
/*页面主体右侧上部*/
#righttop{
float:right;
width:50%;
height:500px;
background:#0F0;
}
/*页面主体右侧下部联系方式*/
#contact{
float:right;
width:50%;
height:300px;
background:#F0F;
}
/*页面底部*/
#footer {
width:800px;
margin:0 auto;
height:50px;
background:#300;
}页面效果页面上的div没有置顶在网页上！然后div与div之间会有一个间距！后面footer部分好像也有点问题！急求各位大神解答，小弟马上要交期末作业！
1 回答
webfz
TA贡献1条经验 获得超0个赞
<!DOCTYPE html>
<html>
<head>
<title> 事件</title>
<style>/*基本信息*/
*{ padding:0px; margin:0px;}
body {
font:12px;
margin:0px;
text-align:center;
background:#FFF;
}
/*网页盒子*/
#container {
width:100%;
background:#CCC;
}
/*页面头部*/
#header {
float:none;
width:800px;
margin:0 auto;
height:100px;
background:#FFCC99;
}
/*页面主体盒子*/
#pageBody {
width:800px;
margin:0 auto;
height:800px;
background:#CCFF00;
}
/*页面主体左侧*/
#leftside {
float:left;
width:50%;
margin:0 auto;
height:800px;
background:#ffcc00;
}
/*页面主体右侧上部*/
#righttop{
float:right;
width:50%;
height:500px;
background:#0F0;
}
/*页面主体右侧下部联系方式*/
#contact{
float:right;
width:50%;
height:300px;
background:#F0F;
}
/*页面底部*/
#footer {
width:800px;
margin:0 auto;
height:50px;
background:#300;
}</style>
</head>
<body>
<div id="container"><!--网页盒子-->
<div id="header">header<!--页面头部-->
</div>
<div id="pageBody"><!--页面主体盒子-->
<div id="leftside">leftside<!--页面左侧内容-->
</div>
<div id="righttop">righttop<!--页面右侧上部内容-->
</div>
<div id="contact">contact<!--页面右侧联系方块-->
</div>
</div>
<div id="footer">footer<!--页面底部-->
</div>
</div>
</body>
</html>你把footer放到pageBody里面了，我建议你以后养成格式化的习惯
- 1 回答
- 1 关注
- 1807 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消