dreamweaver DIV CSS 制作这样网页框架代码,要代码

大家看看好答案我再追加20分... 大家看看 好答案我再追加20分 展开
 我来答
百度网友07da055
2010-12-23 · TA获得超过659个赞
知道小有建树答主
回答量:356
采纳率:33%
帮助的人:234万
展开全部

楼主看看这个代码可以不

效果见图

<body style="margin: 0 auto; width: 1000px;">

    <div id="div_1" style="height: 50px; background-color: Red;">

        1层

    </div>

    <div id="div_2" style="height: 50px; background-color: Gray;">

        2层

    </div>

    <div id="div_3" style="height: 50px;">

        <div id="div_3_1" style="height: 100%; float: left; width: 300px; background-color: Yellow;">

            3层左

        </div>

        <div id="div_3_3" style="height: 100%; float: right; width: 300px; background-color: Yellow;">

            3层右</div>

        <div id="div_3_2">

            <div id="div_3_2_1" style="height: 50%; background-color: Blue">

                3层中上

            </div>

            <div id="div_3_2_2">

                3层中下

            </div>

        </div>

    </div>

    <div id="div_4" style="height: 50px; background-color: Green;">

        4层

    </div>

</body>

常州小北服饰
推荐于2016-03-12
知道答主
回答量:25
采纳率:0%
帮助的人:28.5万
展开全部
<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.head { width:1000px; height:100px; margin:auto; overflow:hidden; border:1px solid #666; }
.banner { width:1000px; height:150px; margin:auto; overflow:hidden; border:1px solid #666; margin-top:10px; }
.main { width:1000px; height:300px; margin:auto; overflow:hidden; border:1px solid #666; margin-top:10px; }
.main .left { width:299px; height:300px; border-right:1px solid #666; float:left; }
.main .center { width:349px; height:300px; border-right:1px solid #666; float:left; }
.main .center .mt { height:100px; border-bottom:1px solid #666;}
.main .center .mb {}

.main .right { width:350px; height:300px; float:left; }
.footer { width:1000px; height:80px; margin:auto; overflow:hidden; border:1px solid #666; margin-top:10px;}
</style>
</head>

<body>

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

<div class="banner">
</div>

<div class="main">
<div class="left"></div>
<div class="center">
<div class="mt"></div>
<div class="mb"></div>
</div>
<div class="right"></div>
</div>

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

</body>
</html>

看看是不是你要的样子,有问题留言给我
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
insomnia0706
2010-12-23
知道答主
回答量:7
采纳率:0%
帮助的人: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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
.div1{width:400px; height:100px; border:1px #333333 solid;}
.div2{width:100px; height:100px; border:1px #333 solid; float:left}
.div3{width:98px; height:46px; border:1px #666 solid;}
.clear{clear:both}
</style>
</head>

<body>
<div>
<div class="div1"></div>
<div class="div1"></div>
<div class="div1">
<div class="div2"></div>
<div class="div2">
<div class="div3"></div>
<div class="div3"></div>
</div>
<div class="div2"></div>
<div class="div1"></div>
</div>

</div>
</body>
</html>
你可以自己修改,大概意思你应该能看懂的
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
fjz1438
2010-12-23 · TA获得超过118个赞
知道答主
回答量:244
采纳率:0%
帮助的人:161万
展开全部
<!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 auto;
}
#all {
margin-top:100px;

}
#top, #center, #bottom {
width:600px;
height:200px;
border-top:#000 1px solid;
}
#bottom{
border-bottom:#000 1px solid;
}
#cl, #cc, #cr {
width:198px;
height:200px;

float:left;
}
#cl,#cc
{border-right:#000 1px solid;
}
#cct {
height:50px;
border-bottom:#000 1px solid;
}
</style>
</head>
<body>
<div id="all">
<div id="top"> 123</div>
<div id="center">
<div id="cl"> 123 </div>
<div id="cc">
<div id="cct"> 123 </div>
213 </div>
<div id="cr">
123
</div>
</div>
<div id="bottom"> 123</div>
</div>
</body>
</html>

长宽高可自己修改。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
唐伯虎爸爸
2010-12-23
知道答主
回答量:3
采纳率:0%
帮助的人: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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#box {
height: 426px;
width: 800px;
margin-right: auto;
margin-left: auto;
}
#top {
height: 100px;
border: 1px solid #666666;
}
#main {
height: 200px;
border: 1px solid #999999;
margin-top: 10px;
margin-bottom: 10px;
}
#left {
width: 200px;
float: left;
height: 200px;
}
#zhong {
width: 400px;
float: left;
height: 200px;
}
#zhongtop {
height: 80px;
}
#zhongdwon {
height: 100px;
}
#right {
width: 198px;
float: left;
height: 200px;
}
#down {
height: 100px;
border: 1px solid #999999;
}
-->
</style>
</head>

<body>
<div id="box">
<div id="top">sfdsdf</div>
<div id="main">
<div id="left">sdfsdf</div>
<div id="zhong">
<div id="zhongtop">aaaaa</div>
<div id="zhongdwon">aaaa</div>
</div>
<div id="right">sdfsdf</div>
</div>
<div id="down">sdfsdf</div>
</div>
</body>
</html>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式