<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>
<!-- Basic Page Needs
================================================== -->
<meta charset="utf-8">
<title>zMooncake Free Html5 Responsive Template</title>
<meta name="description" content="Free Html5 Templates and Free Responsive Themes Designed by Kimmy">
<meta name="author" content="www.moobnn.com">
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/zerogrid.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">
<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
<!--[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 src="js/html5.js"></script>
<![endif]-->
<link href='./images/favicon.ico' rel='icon' type='image/x-icon'/>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.flexslider-min.js"></script>
<script src="js/kwiks.js"></script>
<script type="text/javascript">
var Main = Main || {};
jQuery(window).load(function() {
window.responsiveFlag = jQuery('#responsiveFlag').css('display');
Main.gallery = new Gallery();
jQuery(window).resize(function() {
Main.gallery.update();
});
});
function Gallery(){
var self = this;
container = jQuery('.flexslider'),
clone = container.clone( false );
this.init = function (){
if( responsiveFlag == 'block' ){
var slides = container.find('.slides');
slides.kwicks({
max : 500,
spacing : 0
}).find('li > a').click(function (){
return false;
});
} else {
container.flexslider();
}
}
this.update = function () {
var currentState = jQuery('#responsiveFlag').css('display');
if(responsiveFlag != currentState) {
responsiveFlag = currentState;
container.replaceWith(clone);
container = clone;
clone = container.clone( false );
this.init();
}
}
this.init();
}
</script>
</head>
<body>
<!--------------Header--------------->
<div class="wrap-header">
<header>
<div id="logo"><a href="#"><img src="./images/logo.png"/></a></div>
<nav>
<ul>
<li class="current"><a href="#">Home</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>
</div>
<!--------------Slideshow--------------->
<section class="featured">
<div id="container">
<div class="flexslider">
<ul class="slides">
<li>
<a href="#"><img src="images/img01.jpg" /></a>
<div class="flex-caption">
<h3>Lorem ipsum dolor sit amet</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis porttitor massa eget pretium. Mauris vel erat sem, id tempor est. Pellentesque lobortis iaculis massa quis auctor.</p>
</div>
</li>
<li>
<a href="#"><img src="images/img02.jpg" /></a>
<div class="flex-caption">
<h3>Lorem ipsum dolor sit amet</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis porttitor massa eget pretium. Mauris vel erat sem, id tempor est. Pellentesque lobortis iaculis massa quis auctor.</p>
</div>
</li>
<li>
<a href="#"><img src="images/img03.jpg" /></a>
<div class="flex-caption">
<h3>Lorem ipsum dolor sit amet</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis porttitor massa eget pretium. Mauris vel erat sem, id tempor est. Pellentesque lobortis iaculis massa quis auctor.</p>
</div>
</li>
<li>
<a href="#"><img src="images/img04.jpg" /></a>
<div class="flex-caption">
<h3>Lorem ipsum dolor sit amet</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In venenatis porttitor massa eget pretium. Mauris vel erat sem, id tempor est. Pellentesque lobortis iaculis massa quis auctor.</p>
</div>
</li>
</ul>
</div>
</div>
<span id="responsiveFlag"></span>
</section>
<!--------------Content--------------->
<section id="content">
<div class="zerogrid">
<div class="row">
<div id="main-content" class="col-2-3">
<article>
<div class="heading">
<h2><a href="#">Sed accumsan libero quis mi commodo et suscipit enim lacinia</a></h2>
<div class="info">
<ul><li><span>By: </span>Admin</li><li><span>Date: </span>November 26, 2012</li><li><span>Categories: </span>Cake</li><li><span>Comments: </span>5</li></ul>
<div class="clearboth"></div>
</div>
<img src="images/inacup_vanilla.jpg"/>
</div>
<div class="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam viverra convallis auctor. Sed accumsan libero quis mi commodo et suscipit enim lacinia. Morbi rutrum vulputate est sed faucibus. Nulla sed nisl mauris, id tristique tortor. Sed iaculis dapibus urna nec dictum. Proin non enim odio. Proin vitae turpis libero, eget feugiat enim. Sed fringilla facilisis convallis.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam viverra convallis auctor. Sed accumsan libero quis mi commodo et suscipit enim lacinia. Morbi rutrum vulputate est sed faucibus. Nulla sed nisl mauris, id tristique tortor. Sed iaculis dapibus urna nec dictum. Proin non enim odio.</p>
<a class="more" href="#">Read more --></a>
</div>
</article>
<article>
<div class="heading">
<h2><a href="#">Sed accumsan libero quis mi commodo et suscipit enim lacinia</a></h2>
<div class="info">
<ul><li><span>By: </span>Admin</li><li><span>Date: </span>November 26, 2012</li><li><span>Categories: </span>Cake</li><li><span>Comments: </span>5</li></ul>
<div class="clearboth"></div>
</div>
<img src="images/inacup_samoa.jpg" />
</div>
<div class="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam viverra convallis auctor. Sed accumsan libero quis mi commodo et suscipit enim lacinia. Morbi rutrum vulputate est sed faucibus. Nulla sed nisl mauris, id tristique tortor. Sed iaculis dapibus urna nec dictum. Proin non enim odio. Proin vitae turpis libero, eget feugiat enim. Sed fringilla facilisis convallis.</p>
<a class="more" href="#">Read more --></a>
</div>
</article>
<article>
<div class="heading">
<h2><a href="#">Sed accumsan libero quis mi commodo et suscipit enim lacinia</a></h2>
<div class="info">
<ul><li><span>By: </span>Admin</li><li><span>Date: </span>November 26, 2012</li><li><span>Categories: </span>Cake</li><li><span>Comments: </span>5</li></ul>
<div class="clearboth"></div>
</div>
<img src="images/inacup_pumpkin.jpg" />
</div>
<div class="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam viverra convallis
漂亮的个性幻灯食品html5模板_黑色 幻灯 个性幻灯 食品 蛋糕 博客 html5.rar
版权申诉
95 浏览量
2021-11-06
12:48:10
上传
评论
收藏 1.82MB RAR 举报
漂亮的个性幻灯食品html5模板_黑色 幻灯 个性幻灯 食品 蛋糕 博客 html5.rar （33个子文件） 
漂亮的个性幻灯食品html5模板_黑色 幻灯 个性幻灯 食品 蛋糕 博客 html5 zthtml5_Mooncake js 
html5.js 2KB jquery.flexslider-min.js 16KB kwiks.js 5KB jquery.min.js 91KB css style.css 6KB flexslider.css 4KB responsive.css 711B zerogrid.css 10KB
index.html 12KB images 
bg_direction_nav.png 2KB border-footer.png 966B
img04.jpg 263KB img01.jpg 256KB img03.jpg 323KB search2.png 1KB logo.png 18KB inacup_pumpkin.jpg 137KB google-icon.png 6KB
themes.gif 359B favicon.ico 1KB port2.jpg 19KB zerotheme.png 13KB inacup_samoa.jpg 132KB bg-heading.png 3KB port3.jpg 20KB img02.jpg 324KB bg_control_nav.png 2KB linkedin-icon.png 5KB facebook-icon.png 5KB rss-icon.png 6KB inacup_donut.jpg 145KB inacup_vanilla.jpg 136KB port1.jpg 18KB资源评论
