部分代码展示：!DOCTYPE html>
<html lang="en">
<head>
<title>Home</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css">
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css">
<link rel="stylesheet" type="text/css" media="screen" href="css/slider.css">
<link rel="stylesheet" type="text/css" media="screen" href="css/tabs.css">
<link rel="stylesheet" href="css/zerogrid.css" type="text/css" media="all">
<link rel="stylesheet" href="css/responsive.css" type="text/css" media="all">
<script src="js/jquery-1.7.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/tms-0.3.js"></script>
<script src="js/tms_presets.js"></script>
<script src="js/cufon-yui.js"></script>
<script src="js/Vegur-L_300.font.js"></script>
<script src="js/Vegur-M_500.font.js"></script>
<script src="js/Vegur-R_400.font.js"></script>
<script src="js/cufon-replace.js"></script>
<script src="js/tabs.js"></script>
<script src="js/FF-cash.js"></script>
<script type="text/javascript" src="js/css3-mediaqueries.js"></script>
<script>
$(window).load(function(){
$('.slider')._TMS({
prevBu:'.prev',
nextBu:'.next',
pauseOnHover:true,
pagNums:false,
duration:800,
easing:'easeOutQuad',
preset:'Fade',
slideshow:7000,
pagination:'.pagination',
waitBannerAnimation:false,
banners:'fromLeft'
})
})
</script>
<!--[if lt IE 8]>
<div style=' clear: both; text-align:center; position: relative;'>
<a href="http//windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
<img src="http//storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
</a>
</div>
<![endif]-->
<!--[if lt IE 9]>
<script type="text/javascript" src="js/html5.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="css/ie.css">
<![endif]-->
</head>
<body>
<!--==============================header=================================-->
<header>
<div class="main zerogrid">
<h1><a href="index.html"><img src="images/logo.png" alt=""></a></h1>
<nav>
<ul class="menu">
<li class="current"><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="clients.html">Clients</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</nav>
</div>
</header>
<section id="header-content">
<div class="main zerogrid">
<div class="slider">
<ul class="items">
<li><img src="images/slider-1.jpg" alt="">
<div class="banner">
<p><strong class="font-1">Use</strong><strong class="font-2">our time</strong><strong class="font-1">to save your</strong><strong class="font-2">money!</strong></p>
<a href="#">Read More</a>
</div>
</li>
<li><img src="images/slider-2.jpg" alt="">
<div class="banner">
<p><strong class="font-1">Good</strong><strong class="font-2">solutions</strong><strong class="font-1">for your</strong><strong class="font-2">business!</strong></p>
<a href="#">Read More</a>
</div>
</li>
<li><img src="images/slider-3.jpg" alt="">
<div class="banner">
<p><strong class="font-1">Use</strong><strong class="font-2">our time</strong><strong class="font-1">to save your</strong><strong class="font-2">money!</strong></p>
<a href="#">Read More</a>
</div>
</li>
<li><img src="images/slider-4.jpg" alt="">
<div class="banner">
<p><strong class="font-1">Good</strong><strong class="font-2">solutions</strong><strong class="font-1">for your</strong><strong class="font-2">business!</strong></p>
<a href="#">Read More</a>
</div>
</li>
</ul>
<div class="pagination">
<ul>
<li><a href="#"><img src="images/slider-1-small.jpg" alt=""></a></li>
<li><a href="#"><img src="images/slider-2-small.jpg" alt=""></a></li>
<li><a href="#"><img src="images/slider-3-small.jpg" alt=""></a></li>
<li><a href="#"><img src="images/slider-4-small.jpg" alt=""></a></li>
</ul>
</div>
</div>
</div>
</section>
<!--==============================content================================-->
<section id="content" class="border">
<div class="zerogrid">
<div class="row">
<div class="col-1-3">
<div class="block-1">
<h3>think.</h3>
<p class="color-1">Genesis is one of <a href="http//blog.templatemonster.com/free-website-templates/" class="link" target="_blank" >free website templates</a> created by TemplateMonster.com team. This website template is optimized for 1280X1024 screen resolution.</p>
<a href="#" class="button">Read More</a>
</div>
</div>
<div class="col-1-3">
<div class="block-1">
<h3>choose.</h3>
<p class="color-1">This <a href="http//blog.templatemonster.com/2012/03/19/free-website-template-business-jquery-slider/" class="link">Genesis Template</a> goes with two packages – with PSD source files and without them. PSD source files are available for the registered members.</p>
<a href="#" class="button">Read More</a>
</div>
</div>
<div class="col-1-3">
<div class="block-1">
<h3>grow.</h3>
<p class="color-1">This website template has several pages: Home Page, About, Our Services, Projects, Clients, Contact Us (note that contact us form – doesn’t work).</p>
<a href="#" class="button">Read More</a>
</div>
</div>
</div>
<div class="row">
<div class="col-2-3">
<div class="left-1 page1-col1">
<h2 class="h2">Welcome to our website!</h2>
<p class="color-1 p2">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullam corper suscipit lobortis </p>
<p>Nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit molestie consequat, vel illum dolore eu feugiat nulla.</p>
<div class="block-2 wrap">
<a href="#">Read More</a>
<p class="extra-wrap">Our work is<strong>dedicated to</strong><strong>the prosperity</strong><strong>of our clients!</strong></p>
</div>
<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla.</p>
<div class="page1-img1"></div>
</div>
</div>
<div class="col-1-3">
<h2 class="left-1">Our News</h2>
<div class="tabs">
<ul class="nav">
<li class="selected"><a href="#tab-1">Latest</a></li>
<li><a href="#tab-2">Popular</a></li>
<li><a href="#tab-3">All News</a></li>
</ul>
<div id="tab-1" class="tab-content">
<div class="inner">
<div class="wrap block-3 border-1">
<img src="images/page1-img2.jpg" alt="" class="img-indent">
<div class="extra-wrap">
<p class="color-1">Duis autem veeum iriure dolor hendrerit.</p>
<p>Molestie consequat, vel nulla facilisis at vero eros et accumsan et iusto.</p>
<p class="color-2"><time datetime="2012-02-18">18-02-2012</time><a href="#" class="link">Read more</a></p>
</div>
</div>
<div class="wrap block-3">
<img src="images/page1-img3.jpg" alt="" class="img-indent">
<div class="extra-wrap">
<p class="color-1">At vero eos et accusam et justo duo.</p>
<p>Dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus.</p>
<p class="color-2"><time datetime="2012-02-18">18-02-2012</time><a href="#" class="link">Read more</a></p>
</div>
</div>
</div>
</div>
<div id="tab-2" class="tab-content">
<div class="inner">
<div class="wrap block-3 border-1">
<img src="images/page1-img3.jpg" alt="" class="img-indent">
<div class="extra-wrap">
<p class="color-1">At vero eos et accusam et justo duo.</p>
<p>Dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus.</p>
<p class="color-2"><time datetime="2012-02-18">18-02-2012</time><a href="#" class="link">Read more</a></p>
</div>
</div>
<div class="wrap block-3">
<img src="images/page1-img2.jpg" alt="" class="img-indent">
<div class="extra-wrap">
<p class="color-1">Duis autem veeum iriure dolor hendrerit.</p>
<p>Molestie consequat, vel nulla facilisis at vero eros et accumsan et iusto.</p>
<p class="color-2"><time datetime="2012-02-18">18-02-2012</time><a href="#" class="link">Read more</a></p>
</div>
</div>
</div>
</div>
<div id="tab-3" class="tab-content">
<div class="inner">
<div class="wrap block-3 border-1">
<img src="images/page1-img2.jpg" alt="" class="img-indent">
<div class="extra-wrap">
<p class="color-1">Dolor hendrerit duis autem veeum iriure .</p>
<p>Eros et accumsan et iusto molestie consequat, vel nulla facilisis at vero.</p>
<p class="color-2"><time datetime="2012-02-18">18-02-2012</time><a href="#" class="link">Read more</a></p>
</div>
</div>
<div class="wrap block-3">
<img src="images/page1-img3.jpg" alt="" class="img-indent">
<div class="extra-wrap">
<p class="color-1">Accusam et justo duo at vero eos et.</p>
<p>Stet clita kasd gubergren, no sea takimata sanctus. Dolores et ea rebum. </p>
<p class="color-2"><time datetime="2012-02-18">18-02-2012</time><a href="#" class="link">Read more</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--==============================footer=================================-->
<footer>
<div class="zerogrid">
<p>© 2012 Genesis Group</p>
<p><a rel="nofollow" href="http//www.zerotheme.com" class="link" target="_blank">Free Html5 Templates</a> by <a rel="nofollow" href="http//www.TemplateMonster.com" class="link" target="_blank">TemplateMonster</a></p>
</div>
</footer>
<script>
Cufon.now();
</script>
</body>
</html>
1778
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
