PS教程论坛,网页制作论坛-51RGB在线教育

 找回密码
 QQ邮箱注册
查看: 150|回复: 1

为什么头部内分区会出现在身体部分?

[复制链接]
匿名  发表于 2018-6-2 16:30:50 |阅读模式
求救!新手我把head细分成3份的时候,明明长宽没有超出head规格,分区还是都一致出现在body里,添加了float还是这样,不懂问题出在哪里,下附明细,求各位前辈指点,谢谢了!


html:
<body>
  <div id="contain" class="class-01 class-02" >
    <div id="head" class="class-01 class-02">第一页</div>
        <div id="head-l">左</div>
        <div id="head-m">中</div>
        <div id="head-r">右</div>
    <div id="body" class="class-01 class-02">第二页</div>
    <div id="foot" class="class-01 class-02">
        <div class="menu"><a href="#">第三页</a></div>
    </div>
  </div>
</body>

css:
#contain{
width: 800px;
height: 968px;
background-color: antiquewhite;
}
#head{
width: 600px;
height: 300px;
background-color: aquamarine;
}
#head-l{
width: 200px;
height: 200px;
background-color: coral;
margin-left:140px;
float:left;
}
#head-m{
width: 100px;
height: 200px;
background-color: crimson;
margin-left: 10px;
float:left;
}
#head-r{
width: 200px;
height: 200px;
background-color:brown;
margin-left: 10px;
float:left;
}
#body{
width: 600px;
height: 300px;
background-color: aqua;
margin-top: 10px;
}

回复

使用道具

0

主题

38

帖子

1202

积分

大校

Rank: 9Rank: 9Rank: 9

积分
1202
发表于 2018-6-3 09:36:36 | 显示全部楼层
<div id="head" class="class-01 class-02">第一页
        <div id="head-l">左</div>
        <div id="head-m">中</div>
        <div id="head-r">右</div>
</div>
回复 支持 反对

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies |上传

本版积分规则

QQ|手机版|Archiver|51RGB在线教育 ( 赣ICP备14008345号-1 )

GMT+8, 2018-7-22 05:31 , Processed in 0.118446 second(s), 23 queries .

Powered by Discuz! X3.1

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表