亲,能帮我整一个表格,用DIV,布局如下图,急,在线等
3个回答
展开全部
不知道你的具体尺寸和边距,只能写个框架你自己修改数值吧:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<style>
body{width:980px;margin:0 auto}
.main{width: 966px;height:482px;margin:0 auto;overflow: hidden}
.main_left{width:240px;height:482px;float: left}
.main_right{width:726px;height:482px;float: right}
.nr1{width:240px;height:120px;margin-top:2px;background: #ccc}
.nr2{width:240px;height:360px;margin-top:2px;background: #ccc}
.nr3{width:482px;height:240px;margin-left:2px;margin-top:2px;float:left;background: #ccc}
.nr4{width:240px;height:240px;margin-left:2px;margin-top:2px;float:left;background: #ccc}
</style>
<div class="main">
<div class="main_left">
<div class="nr1"><a href="#.html"><img src="#.jpg" /></a></div>
<div class="nr2"><a href="#.html"><img src="#.jpg" /></a></div>
</div>
<div class="main_right">
<div class="nr3"><a href="#.html"><img src="#.jpg" /></a></div>
<div class="nr4"><a href="#.html"><img src="#.jpg" /></a></div>
<div class="nr4"><a href="#.html"><img src="#.jpg" /></a></div>
<div class="nr4"><a href="#.html"><img src="#.jpg" /></a></div>
<div class="nr4"><a href="#.html"><img src="#.jpg" /></a></div>
</div>
</div>
<div style="clear: both"></div>
</body>
</html>
展开全部
假定整体宽度是400,高度是200,代码如下。
<div style="width:400px; height:200px;">
<div style="width:100px; height:75px; border:0px; float:left;">1</div>
<div style="width:200px; height:100px; float:left;">2</div>
<div style="width:100px; height:100px; float:left;">3</div>
<div style="width:100px; height:125px; float:left; position:relative; top:-25px;">4</div>
<div style="width:100px; height:100px; float:left; position:relative; top:-125px; left:100px;">5</div>
<div style="width:100px; height:100px; float:left; position:relative; top:-125px; left:100px;">6</div>
<div style="width:100px; height:100px; float:left; position:relative; top:-125px; left:100px;">7</div>
</div>
<div style="width:400px; height:200px;">
<div style="width:100px; height:75px; border:0px; float:left;">1</div>
<div style="width:200px; height:100px; float:left;">2</div>
<div style="width:100px; height:100px; float:left;">3</div>
<div style="width:100px; height:125px; float:left; position:relative; top:-25px;">4</div>
<div style="width:100px; height:100px; float:left; position:relative; top:-125px; left:100px;">5</div>
<div style="width:100px; height:100px; float:left; position:relative; top:-125px; left:100px;">6</div>
<div style="width:100px; height:100px; float:left; position:relative; top:-125px; left:100px;">7</div>
</div>
追问
兄弟,这个不行啊,也许是我搞错了,我把图片地址,尺寸发你一下吧
晕,这个长了不让发啊,怎么办
追答
我私信你
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询