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

css混合布局遇到问题?

为什么像所教的那样设置,效果不一致

正在回答

2 回答

好的,谢谢


0 回复 有任何疑惑可以回复我~

参考 一下 

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

body{ margin:0; padding:0; font-size:30px; font-weight:bold}

div{ text-align:center; line-height:50px}

.top{ height:100px;background:#9CF}

.head,.main{ width:960px; margin:0 auto;}

.head{ height:100px; background:#F90}

.left{ width:220px; height:600px; background:#ccc; float:left;}

.right{ width:740px; height:600px;background:#FCC; float:right}

.r_sub_left{ width:540px; height:600px; background:#9C3; float:left}

.r_sub_right{ width:200px; height:600px; background:#9FC; float:right;}

.footer{ height:50px; background:#9F9; clear:both;}

</style>

</head>


<body>

<div class="top">

    <div class="head">head</div>

</div>

<div class="main">

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

    <div class="right">

    <div class="r_sub_left">sub_left

        </div>

        <div class=" r_sub_right">sub_right

        </div>

    </div>

</div>

<div class="footer">footer</div>

</body>

</html>


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

beyond_呵呵 提问者

好的,谢谢
2018-04-02 回复 有任何疑惑可以回复我~
#2

慕莱坞1835578

为什么视频上,也没加clear:both,绿色的块也在下面
2019-07-29 回复 有任何疑惑可以回复我~

举报

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

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

进入课程

css混合布局遇到问题?

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