<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<style type="text/css">
.all{ 1090px;
margin: 0 auto;
padding: 0;
}
.all .header{
1090px;
/*height: 650px;*/
background-color: red;
}
.all .nav{
1090px;
height: 70px;
/*background-color: skyblue;*/
}
.all .nav img{
margin-top: 10px;
margin-left: 60px;
}
.all .nav .word1{
/*float: left;*/
margin:center;
}
.all .nav ul{
float: right;
margin-top: 6px;
}
.all .nav li{
float: left;
list-style: none;
margin-top: 10px;
padding: 10px 10px 10px 10px ;
margin-right: 20px;
}
.all .nav li:hover{
/*color: blue;*/
color: #77ADBB;
background-color: white;
margin-top: 20px;
font: 20px;
height: 1px;
}
.all .nav li img{
margin-top: -6px;
margin-right: 6px;
}
.all .header{
1090px;
height: 600px;
background-image: url("images/f.jpg");
}
.all .header .word2{
padding: 170px 600px 300px 100px;
color: skyblue;
font-size: 10px;
}
.all .header .word3{
color: skyblue;
font-size: 40px;
}
.all .header .red{
200px;
height: 40px;
background-color: #F82A53;
margin-left: 100px;
margin-top: -260px;
}
.all .header font{
color: white;
padding: 4px 60px 20px 60px;
margin-top: -10px;
}
.all .red .redword{
float: left;
margin-top: 4px;
}
.all .red .redword:hover{
color: #7070D4;
}
.all .fourli{
float: left;
}
.all .fourli li{
float: left;
list-style: none;
margin-left: 175px;
margin-top: 40px;
}
.all .wordli{
float: left;
}
.all .fourli li{
float: left;
200px;
height: 200px;
margin-left: 60px;
margin-top: 60px;
}
.all .fourli img{
padding: 1px 60px 60px 60px;
}
.all .fourli .one1{
margin-left: 190px;
padding: 20px 60px -10px 20px;
}
.all .all_se{
1090px;
float: left;
background-color: #EEEEEE;
height: 300px;
}
.all .all_se img{
margin: 0 auto;
padding: 80px 600px 60px 500px;
}
.all_se font{
float: left;
margin-left: 260px;
color: gray;
}
.all .cityd{
margin-top: 580px;
background:url("images/search-bg.jpg");
height: 340px;
/*background-color: blue;*/
}
.all .cityd .lookword{
margin-top: 100px;
padding: 60px 500px 20px 480px;
}
.all .cityd .newworld{
color: white;
/*background-color: red;*/
1090px;
height: 300px;
padding: 80px 300px 10px 480px;
}
.all .cityd .newworld .word222{
margin-left: -60px;
}
.all .photo{
margin-top: 1px;
1090px;
height: 500px;
/*background-color: blue;*/
}
.all .photo li{
list-style: none;
}
.all .photo li{
float: left;
200px;
height: 400px;
margin-top: 80px;
margin-left: 40px;
/*background-color: blue;*/
}
.photo li .photo2{
padding: 60px 10px 10px 10px;
}
.photo font{
margin-left: 60px;
}
.photo p{
margin-top: 20px;
margin-left: 40px;
}
.all .long{
1090px;
margin-top: 140px;
/*background-color: red;*/
}
.all .words{
margin-top: -360px;
/*background-color: blue;*/
200px;
float: right;
}
.all .threep{
1090px;
background-color: blue;
}
.all .threeone{
float: left;
360px;
height: 400px;
background-color: #E65D5D;
}
.all .threeone font{
float: left;
margin-left: 130px;
margin-top: 130px;
}
.all .threeone p{
margin-left: -40px;
}
.all .threep .threetwo{
margin-left:360px
360px;
float: left;
height: 400px;
background-color: yellow;
}
.all .threeth img{
360px;
height: 400px;
float: right;
margin-left: 220px;
}
/*
.all .threetwo {
background-color: blue;
margin-left: 360px;
height: 400px;
360px;
float: left;
}
*/
.all .white{
margin-left: 260px;
380px;
height: 400px;
/*background-color: blue;*/
}
.all .white font{
float: left;
margin-left: 170px;
margin-top: 80px;
}
.all .white p{
float: left;
margin-left: 70;
600px;
color: gray;
}
.divfour .firsttt{
400px;
height: 400px;
margin-top: 260px;
background-color: #E65D5D;
}
.divfour .fourone{
600px;
height: 400px;
margin-top: -400px;
float: right;
background-color: blue;
}
.all .lastone{
1090px;
height: 300px;
margin-top: 80px;
background-color: #333333;
}
.all .lastone .words{
color: white;
margin-left: 200px;
margin-top: -30px;
padding: 60px 400px 20px 400px;
}
.all .lastone .words p{
float: left;
400px;
height: 20px;
margin-left: -170px;
}
.all .lastone .picter{
margin-left: 300px;
}
.all .lastone .picter font:hover{
color: #7D7DD8;
/*background-color: #7D7DD8;*/
}
.all .lastone li{
float: left;
list-style: none;
margin-top: 110px;
margin-left: 40px;
}
</style>
<body>
<div class ="all">
<div class = "nav">
<img src="images/header-logo.png" width="40" height = "40">
<b class="word1">新世界</b>
<ul>
<li> 首页</li>
<li> 最新活动</li>
<li> 项目介绍</li>
<li> 爱心专区</li>
<li> 关于我们</li>
<li><img src="images/header-user.png"> 登陆</li>
</ul>
</div>
<div class = "header">
<div class ="word2">
<p class="word3"><B>Time of new life</B></p>
<p>新时代，年轻的人们让我们一起</p>
<p>体验生活，享受新生活</p>
</div>
<div class="red">
<B ><font class="redword">开始体验</font> </B>
</div>
</div>
<div class="fourli">
<ul>
<li><img src="images/advancement-1.png"> <br>打造全新世界观，让你更爱你的生活 <!-- <font size="20" class="one1">|</font> --></li>
<li><img src="images/advancement-2.png"><br>丰富多彩的公益活动，发挥新世界的主人公意识 <!-- <br><font size="20" class="one1">| --><!-- </font> --></li>
<li><img src="images/advancement-3.png"><br>时尚的新理念，超前体验未知的生活 <!-- <br><font size="20" class="one1">|</font> --></li>
<li><img src="images/advancement-4.png"><br>完善的培训机制，培养你的全新的世界观 </li>
</ul>
</div>
<div class="all_se">
<img src="images/question-logo.png">
<font clear="w" size="6"> 关于新世界，你不知道的还有什么？</font>
</div>
<div class="cityd">
<div class="newworld">
<font size="4" class="word11">查找新世界城市活动信息</font>
<br><br><br><font class="word222" size="2">每个城市不同的活动信息，请自主查询您所需要了解的城市</font>
</div>
<div ></div>
</div>
<div class="photo">
<ul>
<li><div class="pohto1">
<img src="images/beijing.png">
</div> <font> <B>北京活动</B> <p style="color: gray">新社区大联盟</p></font></li>
<li><font> <B>上海活动</B> <p style="color: gray">夜上海景观探索</p></font> <div class="photo2">
<img src="images/shanghai.png">
</div></li>
<li><div class="photo3">
<img src="images/shenzhen.png">
</div> <font> <B>深圳活动</B> <p style="color: gray">全新海岸线观点站</p></font></li>
<li><div class="photo4">
<img src="images/hongkong.png">
</div><font> <B>香港活动</B> <p style="color: gray">奢侈消费大派送</p></font></li>
</ul>
</div>
<div class="long">
<div class="foot">
<img src="images/model1 (1).png">
</div>
<div class="words">
<font size="6">新世界/<font color="red">01</font> </font>
<p><font color="gray"> 新世界新世界新世界新世界<p>新世界新世界新世界新世界</p> <p>新世界新世界新世界新世界</p>新世界新世界新世界新世界<p>新世界新世界新世界新世界</p></font></p>
<p><br><br><font color="red">更多精彩</font> </p>
</div>
</div>
<div class="threep">
<div class="threeone">
<font color="white">新时代<p>关于爱生活的我们</p> <br>查看更多</font>
</div>
<div class="threetwo"></div>
<div class="threeth">
<img src="images/model2.png">
</div>
</div>
<div class="white">
<font class="whiteo" size="4">成为我们的志愿者 </font>
<p>新世界的大家庭需要每一个关爱生活的人，如果你够年轻，有梦想，有激情，那就不要犹豫，快来加入我们，成为改变所有人生活的人</P>
</div>
<div class="divfour">
<div class ="firsttt">
</div>
<div class="fourone"></div>
</div>
<div class="lastone">
<div class="words">
<font> 联系我们</font>
<p><font>为了更好地获取我们最新产品资讯，您可以留下您的电子邮件快速订阅我们的产品资讯，也可以一下任何方式关注我们的动态</font></p>
</div>
<div class="picter">
<ul>
<li><a href="#"> <img src="images/qq.png"><br><font color="white">QQ</font></a></li>
<li><a href="#"><img src="images/twitter.png"><br><font color="white">Twitter</font></a></li>
<li><a href="#"><img src="images/globe.png"><br><font color="white">新浪微博</font></a></li>
<li><a href="#"><img src="images/1.png"><br><font color="white">新浪博客</font></a></li>
</ul>
</div>
</div>
</div>
</body>
</html>