请问，网页设计中怎样用div+css进行如下图的分块，谢谢。
展开全部
如果有成图的话，可以考虑PS切图
手写的话，代码就比较多了
<!DOCTYPE html>
<html>
<head>
<title>手写代码</title>
<meta charset="utf-8">
<style type="text/css">
*{padding:0;margin: 0;}
.w1260{width: 1260px;margin: 12px auto;margin-top: 0;}
.h-1{border: 1px solid #bbb;height: 120px;}
.h-2{border: 1px solid #bbb;height: 80px;}
.h-3{border: 1px solid #bbb;position: relative;overflow: hidden;}
.h-3 .h3-l{float: left;width: 33%;border-right: 1px solid #bbb;padding:1%;}
.h-3 .h3-l .h3-l1{border: 1px solid #bbb;height: 200px;}
.h-3 .h3-l .h3-l2{border: 1px solid #bbb;height: 200px;margin-top: 12px;}
.h-3 .h3-r{float: right;width: 62.6%;padding: 1%;padding-left: 0;}
.h-3 .h3-r .h3-r1{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;}
.h-3 .h3-r .h3-r1 .h3-r1-l{float: left;height: 80px;border-right: 1px solid #bbb;width: 75%}
.h-3 .h3-r .h3-r1 .h3-r1-r{float: right;height: 80px;width: 24%;}
.h-3 .h3-r .h3-r2{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;height: 100px;margin-top: 12px;}
.h-3 .h3-r .h3-r3{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;margin-top: 12px;}
.h-3 .h3-r .h3-r3 .h3-r3-l{float: left;height: 200px;border-right: 1px solid #bbb;width: 75%}
.h-3 .h3-r .h3-r3 .h3-r3-r{float: right;height: 200px;width: 24%;}
.h-4{border: 1px solid #bbb;height: 80px;}
</style>
</head>
<body>
<div class="h-1 w1260"></div>
<div class="h-2 w1260"></div>
<div class="h-3 w1260">
<div class="h3-l">
<div class="h3-l1"></div>
<div class="h3-l2"></div>
</div>
<div class="h3-r">
<div class="h3-r1">
<div class="h3-r1-l"></div>
<div class="h3-r1-r"></div>
</div>
<div class="h3-r2"></div>
<div class="h3-r3">
<div class="h3-r3-l"></div>
<div class="h3-r3-r"></div>
</div>
</div>
</div>
<div class="h-4 w1260"></div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<div id="header"></div>
<div id="nav"></div>
<div id="mainbody">
<div class="left"></div>
<div class="right"></div>
</div>
<div id="footer"></div>
<div id="nav"></div>
<div id="mainbody">
<div class="left"></div>
<div class="right"></div>
</div>
<div id="footer"></div>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
