<!DOCTYPE html>
<!--[if IE]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if IE 8]>
<html class="no-js ie8 oldie" lang="en">
<![endif]-->
<!--[if gt IE 8]>
<!-->
<html lang="en">
<!--<![endif]-->
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="css/style.css">
<title>css3仿虾米网banner相片墙 - 网页模板</title>
</head>
<body>
<div id="container">
<div class="demo-wrapper">
<div id="demo">
<div class="col">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5969313944_e5d6d67b23_s.gif" alt="monaco see">
<span class="todos-thumb-span">monaco see</span>
</p>
</div>
</div>
<div class="col col1">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5913489167_1e78858455_s.gif" alt="the flower">
<span class="todos-thumb-span">the flower</span>
</p>
</div>
</div>
<div class="col col2">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5914033844_504a351fd4_m.gif" alt="Chapel Bridge">
<span class="todos-thumb-span">Chapel Bridge</span>
</p>
</div>
</div>
<div class="col col3">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5914036076_e409dddb37_s.gif" alt="Luzern sky">
<span class="todos-thumb-span">Luzern sky</span>
</p>
</div>
</div>
<div class="col col4">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5914055722_906169a54b_s.gif" alt="Luzern castle">
<span class="todos-thumb-span">Luzern castle</span>
</p>
</div>
</div>
<div class="col col5">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5969337090_e040bb9ce2_m.gif" alt="Milano hotel's sunflower">
<span class="todos-thumb-span">Milano hotel's sunflower</span>
</p>
</div>
</div>
<div class="col col6">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5908131051_25a8212125_m.gif" alt="i love salzburg">
<span class="todos-thumb-span">i love salzburg</span>
</p>
</div>
</div>
<div class="col col7">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5908123183_76bb62439f_s.gif" alt="salzburg castle help">
<span class="todos-thumb-span">salzburg castle</span>
</p>
</div>
</div>
<div class="col col8">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5883863501_052ebe2775_s.gif" alt="the berchtesgaden sky">
<span class="todos-thumb-span">the berchtesgaden sky</span>
</p>
</div>
</div>
<div class="col col9">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884485140_194382f403_s.gif" alt="rose">
<span class="todos-thumb-span">kingsee rose</span>
</p>
</div>
</div><!-- line1 -->
<div class="col line">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884419570_78ea1e933a_s.gif" alt="berchtesgaden lake">
<span class="todos-thumb-span">berchtesgaden lake</span>
</p>
</div>
</div>
<div class="col line col1">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884628148_1d9c8488bb_s.gif" alt="bike">
<span class="todos-thumb-span">do you want to borrow a bike?</span>
</p>
</div>
</div>
<div class="col line col2">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884611736_c436b7092e_s.gif" alt="my slipper">
<span class="todos-thumb-span">my slipper</span>
</p>
</div>
</div>
<div class="col line col3">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884586016_104e199f31_s.gif" alt="Riviera C te d’Azur">
<span class="todos-thumb-span">Riviera C te d’Azur</span>
</p>
</div>
</div>
<div class="col line col4">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884061365_19b7de880f_s.gif" alt="the small cake">
<span class="todos-thumb-span">the small cake before the lunch</span>
</p>
</div>
</div>
<div class="col line col5">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5884625878_3d2d53c6f1_s.gif" alt="the runner">
<span class="todos-thumb-span">the runner in nice</span>
</p>
</div>
</div>
<div class="col line col6">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5968805507_918b3be965_s.gif" alt="Musée du Louvre Sphinx">
<span class="todos-thumb-span">Musée du Louvre Sphinx</span>
</p>
</div>
</div>
<div class="col line col7">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5968794447_c3231fc306_s.gif" alt="the coffee shop">
<span class="todos-thumb-span">the coffee shop out of the Musée du Louvre</span>
</p>
</div>
</div>
<div class="col line col8">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5969349526_c98dd22352_s.gif" alt="Musée du Louvre out side's fountain">
<span class="todos-thumb-span">Musée du Louvre out side's fountain</span>
</p>
</div>
</div>
<div class="col line col9">
<div class="big todos-thumb">
<p><img src="img/loader.gif" data-src="img/5968797341_3e212999a5.gif" alt="Venus de Milo">
<span class="todos-thumb-span">Venus de Milo</span>
</p>
</div>
</div><!-- line2 -->
</div>
</div><!--! end of #demo -->
</div> <!--! end of #container -->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<!-- imageload effect -->
<script type="text/javascript" src="js/jquery.unveil.min.js"></script>
<script>
$(function() {
$("#demo img").unveil(300);
});
</script>
<!-- imageload effect -->
<div style="text-align:center;clear:both">
<p>适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. </p><br>
<p>来源:<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>