为了账号安全,请及时绑定邮箱和手机立即绑定

5-3 这样对吗 我拉网页下来时LEFT也会掉

<!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=utf-8" />

<title>混合布局编程挑战</title>

<style type="text/css">

body{ margin:0; padding:0; font-size:30px; color:#fff}

.top{width:100%; background:#ccc;height:100px;}

.main{ height:600px; background:#F00;}

.left{ width:200px;height:600px; background:#00F;float:left;}

.right{width:85%;background:#0FF;height:600px;float:right;}

.foot{width:100%;height:50px; background:#F60; clear:both}

</style>


</head>


<body>

<div class="top">top</div>

<div class="main">

    <div class="right">right</div>

    <div class="left">left</div>

</div>

<div class="foot">foot</div>


</body>

</html>


正在回答

1 回答

因为

html部分:<div class="right">right</div>在<div class="left">left</div>前边

css部分:同一父元素下面的浮动的元素不会相互重叠,无法容下第二个浮动元素<div class="left">left</div>时,他会向下移动,直到有足够的空间来显示它。


1 回复 有任何疑惑可以回复我~
#1

菜鸟攻城狮i 提问者

非常感谢!
2015-07-11 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
如何用CSS进行网页布局
  • 参与学习       209624    人
  • 解答问题       1153    个

用最简洁的案例教你布局的那些知识,这是前端工程师基本技能

进入课程

5-3 这样对吗 我拉网页下来时LEFT也会掉

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信