网页图片明天完善一下再发
*{margin:0px;
padding:0px;}
div.content{margin-left:20px;
font-size:12px;}
div.top{width:1200px;
height:80px;
background-color:#630;
color:white;
float:left;}
div.top_left{
text-align:center;
float:left;
width: 400px;
}
div.top_left p{margin-top:20px;
margin-left:20px;}
div.top_left span{font-size:24px;
}
div.top_right{
float:left;
text-indent:2pt;
padding-left:120px;}
div.top_right p{float:right;
margin-top:20px;}
div.main{width:1000px;
margin-left:100px;}
div.main_top_left{background-image:url(image/left_bg.jpg);
background-repeat:no-repeat;
background-position:left 80px;
width: 300px;
line-height: 18pt}
div.main_top_left img{margin-left:70px;
margin-top:70px;}
div.main_top_left span{margin-left:40px;
padding-top: 30px;
float: left;
}
div.main_top_left span p{text-indent: 19pt;}
div.main_top_right{background-image:url(image/right_bg.jpg);
background-repeat:no-repeat;
background-position:right bottom;
float: right;
width: 600px;
height: 300px;}
div.main_top_right img{margin-left: 40px;
margin-top: 20px;
}
div.main_middle{width:1000px;
margin-bottom: 20px;}
div.main_middle div img{margin-left: 25px;
margin-top: 10px;}
div.main_bottom h3{color: red;
padding-top: 10px;}
div.main_bottom_left{border-style: solid;
border-color: red;
border-width: thin;
width: 300px;}
div.main_bottom_left div ul{margin-left: 30px;
margin-top: 10px;
margin-bottom: 20px;}
div.main_bottom_left div ul li{border-style: dashed;
border-color: black;
border-width:2px;
align-content: center;
padding-top: 5px;
padding-bottom: 5px;}
div.main_bottom_center{border-style: solid;
border-color: red;
border-width: thin;
width: 300px;
margin-left: 20px;
position: absolute;
left: 440px;
top:690px;
height: 280px;}
div.main_bottom_center img{float: left;
}
div.main_bottom_right{border-style: solid;
border-color: red;
border-width: thin;
width: 300px;
position: absolute;
left: 800px;
top:690px;
height: 280px;
line-height: 10px;}
div.footer{width: 1200px;
height: 60px;
background-color:#A6B8D4;
border-top: 4px #1D1003;
border-top-style: solid;
margin-top: 40px;
text-align: center;
line-height: 12px;}
<link href="html.css" type="text/css" rel="stylesheet" />
</head>
<div class="content">
<div class="top">
<div class="top_left"><p>skymood <span>私人定制</span>方案！<br />
整体橱柜/欢乐谷/衣柜/红木门/座椅 丹形定制</p>
</div>
<div class="top_right">
<img src="image/right.jpg" />
<p>家具是居家的必需品，高端典雅的家<br />具不但为居住环境增添色彩，还彰显出主人,<br />的审美意趣，我们致力于为客户制定最适合的家具。</p>
</div>
</div>
<div class="main">
<div class="main_top">
<div class="main_top_left">
<img src="image/h3.png" /><br />
<span>美乐乐家居网（天津美维信息技术有限公司）创立于2008年，是中国可信赖的一站式家居O2O电商。自创始之初，美乐乐一直是电商创新的先行者，也是中国早期进入家具电商领域的B2C网站。2011年，美乐乐开辟家居电商行业O2O营销模式，实现线上选购与线下体验的融合，抢先试水家居行业O2O新零售模式。<br />
<p>美乐乐平台涵盖家具、建材、家居家饰等3大品类，以自营+第三方模式提供超过2万余款商品，并在全国30个省份200余座城市设立了近300家线下体验馆，实现了线上线下快乐购，一站式无忧置家。</p></span>
</div>
<div class="main_top_right">
<img src="image/pic1.jpg" />
<img src="image/pic2.jpg" />
<img src="image/pic3.jpg" /><br />
<img src="image/pic4.jpg" />
<img src="image/pic5.jpg" />
<img src="image/pic6.jpg" />
</div>
</div>
<div class="main_middle">
<img src="image/head.jpg" /><br />
<div><img src="image/img1.jpg" />
<img src="image/img2.jpg" />
<img src="image/img3.jpg" />
<img src="image/img4.jpg" />
</div>
</div>
<div class="main_bottom">
<div class="main_bottom_left">
<h3>NEWS 新闻动态</h3>
<div><ul>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
<li>2008年美乐乐家居网创立</li>
</ul></div>
</div>
<div class="main_bottom_center">
<h3>Active 活动动态</h3><br>
<img src="image/pp1.jpg"><h4>7折优惠活动</h4><br><br>
2014年11月11日狂欢庆典<br />
<br><br><br><img src="image/pp1.jpg"><h4>7折优惠活动</h4><br><br>
2014年11月11日狂欢庆典
</div>
<div class="main_bottom_right">
<h3>联系我们</h3><br>
<img src="image/tel.png">
<h4>skymood 家具专营店</h4><br>
TEL 0000000<br /><br>
TAX 0000000<br /><br>
add suzhou.......
</div>
</div>
</div>
<div class="footer">
Copyright 2014 by ********<br /><br />
TEL 0000000 from ********<br /><br />
TAX 0000000 add 江苏suzhou.......
</div>
</div>
</body>
</html>
