<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!--引入清空所有样式的样式文件-->
<link rel="stylesheet" type="text/css" href="../TOOLS/CSS/reset.css">
<link rel="stylesheet" type="text/css" href="CSS/page-index.css">
</head>
<body>
<div class="header wth">
<ul class="nav">
<li>
<a href="#">HOME</a>
<p>Back to home</p>
</li>
<li>
<a href="#">PRODUCTS</a>
<p>What we have for you</p>
</li>
<li>
<a href="#">SERVICES</a>
<p>Things we do</p>
</li>
<li>
<a href="#">BLOG</a>
<p>Follow our updates</p>
</li>
<li>
<a href="#">CONTACT</a>
<p>Ways to reach us</p>
</li>
</ul>
<div class="logo">
<a href="#" title="一个有趣的连接">
<img src="img\logo(2).png" alt="网站的Logo">
</a>
</div>
</div>
<div class="banner wth">
<img id="banner_img" src="img\Banner_Img.png" alt="这是一个图片" width="100%">
</div>
<div class="content wth clearfix">
<h1>Lorem ipsum dolor sit amet,consectetur adipisicing elit</h1>
<div class="first">
<h2>Perfect Logic</h2>
<p class="div_p1">Are you want your website to do</p>
<div class="imgDiv">
<img src="img\er.jpg" alt="图片">
</div>
<p class="div_p2">I’ve seen things you people wouldn’t believe. Attack ships on fire off the shoulder of
Orion. I watched C-beams glitter in the dark near the Tannhauser Gate. All those moments will be lost in
time like tears in rain. Time to die.</p>
<a href="#" class="buta">了解更多=></a>
</div>
<div class="second">
<h2>Complete Solution</h2>
<p class="div_p1">A tool anything and everything you can think</p>
<div class="imgDiv">
<img src="img\sna.jpg" alt="图片">
</div>
<p class="div_p2">Night gathers, and now my watch begins. It shall not end until my death. I shall take no
wife, hold no lands, father no children. I shall wear no crowns and win no glory. I shall live and die
at my post. I am the sword in the darkness. I am the watcher on the walls.</p>
<a href="#" class="buta">了解更多=></a>
</div>
<div class="third">
<h2>Uber Culture</h2>
<p class="div_p1">Fresh Modern and ready for future</p>
<div class="imgDiv">
<img src="img\yi.jpeg" alt="图片">
</div>
<p class="div_p2">It was the best of times, it was the worst of times, it was the age of wisdom, it was the
age of foolishness, it was the epoch of belief, it was the epoch of incredulity, it was the season of
Light.</p>
<a href="#" class="buta">了解更多=></a>
</div>
</div>
<div class="contact wth clearfix">
<div class="diyi">
<h2>Social Connection</h2>
<p class="P_1">Never allow yourself to get discouraged and think that your life is insignificant and can’t
make a change.</p>
<div class="XiaoTubiao">
<a href="#" class="mar"><img src="img\ditu.png" alt=""></a>
<a href="#" class="mar"><img src="img\shipin.png" alt=""></a>
<a href="#" class="mar"><img src="img\zhuye.png" alt=""></a>
<a href="#" class="mar"><img src="img\ziliao.png" alt=""></a>
<a href="#" class="mar"><img src="img\cart.png" alt=""></a>
</div>
<h2 class="nl">Newsletter</h2>
<p class="P_1">Some of us get dipped in flat, some in satin, some in gloss. But every once in a while you
find someone who's iridescent, and when you do, nothing will ever compare.</p>
<input type="text" class="txt" placeholder="">
<button type="submit" class="sub_btn">提交</button>
</div>
<div class="dier">
<h2>Contact</h2>
<form action="#">
<input type="text" class="txt" placeholder="username">
<input type="text" class="txt" placeholder="password">
<textarea class="tarea" placeholder="message"></textarea>
<button type="submit" class="sub_btn">提交</button>
</form>
</div>
<div class="disan">
<h2>News Updates</h2>
<img src="img\MR (1).png" alt="" width="80px">
<p>Diligence is the mother of good plough deep while shuggards sleep,you will have corn to sell and to
keep.( America)</p>
<img src="img\MR (3).png" alt="" width="80px">
<p>Four short words sum up what has lifted most successful individuals above the crowd: a little bit
more.</p>
<img src="img\MR (5).png" alt="" width="80px">
<p id="JiYa">Truth needs no colour; beauty,no pencil. </p>
<button type="submit" class="sub_btn">提交</button>
</div>
</div>
<div class="footer">
<div class="wth">
<p class="copy"> Copyright 2010.Studio VIVROCKS.All Rights Reserved</p>
<p>Site Power by Wordpress . Design and Developed by VIVROCKS.</p>
<p><a href="#">Home</a>|<a href="#">About</a>|<a href="#">Products</a>|<a href="#">Address</a>|<a href="#">Services</a>|<a href="#">Contact</a></p>
<p><a href="#">Privary Policy</a> |<a href="#">Terms of use</a></p>
</div>
</div>
</body>
</html>