动态布局
图片
图片
lt.gif 
lb.gif 
r.gif 
rb.gif 
rt.gif 
<!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{
background:#fff;
font:13px/1.5 Arial, Helvetica, sans-serif;
margin:0;
padding:0;
}
.rounded{
background:#aaa url(image/lt.gif) top left no-repeat;
width:100%;
}
.rounded h2{
background:url(image/rt.gif) top right no-repeat;
padding:20px 20px 10px;
margin:0;
}
.rounded .main{
background:url(image/r.gif) top right repeat-y;
padding:10px 20px;
margin:-2em 0 0 0;
}
.rounded .footer{
background:url(image/lb.gif) bottom left no-repeat;
}
.rounded .footer p{
color:#888;
text-align:right;
background:url(image/rb.gif) bottom right no-repeat;
display:block;
padding:10px 20px 30px;
margin:-2em 0 0 0;
}
#header,#contatiner,#pagefooter{
width:70%;
margin:0 auto;
}
#contatiner{
position:relative;
}
#content{
width:69%;
left:30%;
position:absolute;
}
#side{
width:30%;
}
</style>
</head>
<body>
<div id="header">
<div class="rounded">
<h2>head</h2>
<div class="main">
<p>垃圾卡时间弗拉多介绍了福建阿里的方式近拉客的是案件数量的福建阿积分dsl卡积分了卡时。</p>
</div>
<div class="footer"><p><a href="#">查看明细</a></p></div>
</div>
</div>
<div id="contatiner">
<div id="content">
<div id="content1">
<div class="rounded">
<h2>content</h2>
<div class="main">
<p>垃圾卡时间弗拉多介绍了福建阿里的方式近拉客的是案件数量的福建阿积分dsl卡积分了卡时间地方了看见爱上的路口附近拉sdk及福利卡萨的家乐福科技阿斯利康房间里爱的就是浪费空间按历史课件福利卡技术的法律框架adsl开发杰拉德是会计法家里开始打飞机了喀什的减肥了看见爱上的离开福建爱上的离开房间里上飞机las
将拉动是解放了喀什的解放路口见dsl福建阿里的房间了的撒开飞机拉德斯基弗拉当时警方立即打上了飞机las记得发垃圾分类jad历史积分阿警方的龙卡及福利的jad了十分恐惧阿里的罚款及阿里是科技发达了卡机分离拉的skf吉拉时间弗拉是觉得烦了阿里山的附近拉。</p>
</div>
<div class="footer"><p><a href="#">查看明细</a></p></div>
</div>
</div>
<div id="content2">
<div class="rounded">
<h2>content</h2>
<div class="main">
<p>垃圾卡时间弗拉多介绍了福建阿里的方式近拉客的是案件数量的福建阿积分dsl卡积分了卡时间地方了看见爱上的路口附近拉sdk及福利卡萨的家乐福科技阿斯利康房间里爱的就是浪费空间按历史课件福利卡技术的法律框架adsl开发杰拉德是会计法家里开始打飞机了喀什的减肥了看见爱上的离开福建爱上的离开房间里上飞机las
将拉动是解放了喀什的解放路口见dsl福建阿里的房间了的撒开飞机拉德斯基弗拉当时警方立即打上了飞机las记得发垃圾分类jad历史积分阿警方的龙卡及福利的jad了十分恐惧阿里的罚款及阿里是科技发达了卡机分离拉的skf吉拉时间弗拉是觉得烦了阿里山的附近拉。</p>
</div>
<div class="footer"><p><a href="#">查看明细</a></p></div>
</div>
</div>
</div>
<div id="side">
<div id="side1">
<div class="rounded">
<h2>side</h2>
<div class="main">
<p>垃圾卡时间弗拉多介绍了福建阿里的方式近拉客的是案件数量的福建阿积分dsl卡积分了卡时间地方了看见爱上的路口附近拉sdk及福利卡萨的家乐福科技阿斯利康房间里爱的就是浪费空的萨法是否间按历大师傅放大师傅史课件福。</p>
</div>
<div class="footer"><p><a href="#">查看明细</a></p></div>
</div>
</div>
<div id="side2">
<div class="rounded">
<h2>side</h2>
<div class="main">
<p>垃圾卡时间弗拉多介绍了福建阿里的方式近拉客的是案件数量的福建阿积分dsl卡积分了卡时间地方了看见爱上的路口附近拉sdk及福利卡萨的家乐福科技阿斯利康房间里爱的就是浪费空的萨法是否间按历大师傅放大师傅史课件福。</p>
</div>
<div class="footer"><p><a href="#">查看明细</a></p></div>
</div>
</div>
</div>
</div>
<div id="pagefooter">
<div class="rounded">
<h2>bottom</h2>
<div class="main">
<p>垃圾卡时间弗拉多介绍了福建阿里的方式近拉客的是案件数量的福建阿积分dsl卡积分了卡。</p>
</div>
<div class="footer"><p><a href="#">查看明细</a></p></div>
</div>
</div>
</body>
</html>
浙公网安备 33010602011771号