<!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
需积分: 0 188 浏览量
2023-09-12
08:43:34
上传
评论
收藏 1.82MB RAR 举报
漂亮的个性幻灯食品html5模板_黑色幻灯个性幻灯食品蛋糕博客html5.rar （33个子文件） 
bg_direction_nav.png 2KB
style.css 6KB border-footer.png 966B
img04.jpg 263KB img01.jpg 256KB flexslider.css 4KB img03.jpg 323KB html5.js 2KB jquery.flexslider-min.js 16KB search2.png 1KB logo.png 18KB inacup_pumpkin.jpg 137KB responsive.css 711B google-icon.png 6KB kwiks.js 5KB
themes.gif 359B zerogrid.css 10KB favicon.ico 1KB port2.jpg 19KB zerotheme.png 13KB inacup_samoa.jpg 132KB
index.html 12KB 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 jquery.min.js 91KB inacup_vanilla.jpg 136KB port1.jpg 18KB资源评论
