<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Serenity</title>
<link rel="stylesheet" href="styles.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/movingbox.css" type="text/css" media="screen">
<script src="js/jquery-1.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/slider.js" type="text/javascript" charset="utf-8"></script>
<script type='text/javascript' src='http//ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js?ver=1.3.2'></script>
<script type='text/javascript' src='js/jquery.color-RGBa-patch.js'></script>
<script type='text/javascript' src='js/example.js'></script>
<!--[if IE]><script src="http//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
<div id="wrapper"><!-- #wrapper -->
<header><!-- header -->
<br><br><br>
<h1>Serenity</h1>
</header><!-- end of header -->
<div class="nav-wrap">
<ul class="group" id="example-one">
<li class="current_page_item"><a href="#one">Home</a></li>
<li><a href="#two">About</a></li>
<li><a href="#three">Blog</a></li>
<li><a href="#">Reviews</a></li>
<li><a href="#">The Show</a></li>
<li><a href="#">Videos</a></li>
<li><a href="#">Photos</a></li>
<li><a href="#">Forums</a></li>
</ul>
</div>
<section id="main"><!-- #main content area -->
<p> </p>
<p><br></p>
<div id="slider">
<img class="scrollButtons left" src="images/leftarrow.png">
<div style="overflow: hidden;" class="scroll">
<div class="scrollContainer">
<div class="panel" id="panel_1">
<div class="inside">
<img src="images/p1.jpg" alt="picture" />
<h2>News Heading</h2>
<p>A very short excerpt goes here... <a href="#">more link</a></p>
</div>
</div>
<div class="panel" id="panel_2">
<div class="inside">
<img src="images/p2.jpg" alt="picture" />
<h2>News Heading</h2>
<p>A very short excerpt goes here... <a href="#">more link</a></p>
</div>
</div>
<div class="panel" id="panel_3">
<div class="inside">
<img src="images/p3.jpg" alt="picture" />
<h2>News Heading</h2>
<p>A very short excerpt goes here... <a href="#">more link</a></p>
</div>
</div>
<div class="panel" id="panel_4">
<div class="inside">
<img src="images/p4.jpg" alt="picture" />
<h2>News Heading</h2>
<p>A very short excerpt goes here... <a href="#">more link</a></p>
</div>
</div>
<div class="panel" id="panel_5">
<div class="inside">
<img src="images/p5.jpg" alt="picture" />
<h2>News Heading</h2>
<p>A very short excerpt goes here... <a href="#">more link</a></p>
</div>
</div>
</div>
<div id="left-shadow"></div>
<div id="right-shadow"></div>
</div>
<img class="scrollButtons right" src="images/rightarrow.png">
</div>
<article>
<p> </p>
<p>Eu eirmod interesset temporibus eum, sea cu amet reque quaestio. Qui erroribus assentior disputando an, quo quot accumsan menandri te, accumsan aliquando dissentias mei ea. Autem verear molestiae an mel, nominavi expetenda similique sit ei. Commodo utroque scribentur id nam, an ferri eruditi perpetua his, et has esse facer nominavi. Mei et essent dictas aliquip. Saepe eligendi phaedrum ne vix, sit putant eruditi eloquentiam at. Eu eirmod interesset temporibus eum, sea cu amet reque quaestio. Qui erroribus assentior disputando an, quo quot accumsan menandri te, accumsan aliquando dissentias mei ea. Autem verear molestiae an mel, nominavi expetenda similique sit ei. Commodo utroque scribentur id nam, an ferri eruditi perpetua his, et has esse facer nominavi. Mei et essent dictas aliquip. Saepe eligendi phaedrum ne vix, sit putant eruditi eloquentiam at. </p>
</article>
</section><!-- end of #content -->
<footer>
<section id="footer-area">
<section id="footer-outer-block">
<aside class="footer-segment first">
<h4> </h4>
<ul>
<li><a href="#">one linkylink</a></li>
<li><a href="#">two linkylinks</a></li>
<li><a href="#">three linkylinks</a></li>
</ul>
</aside><!-- end of #first footer segment -->
<aside class="footer-segment second">
<h4> </h4>
<ul>
<li><a href="#">one linkylink</a></li>
<li><a href="#">two linkylinks</a></li>
<li><a href="#">three linkylinks</a></li>
</ul>
</aside><!-- end of #second footer segment -->
<aside class="footer-segment third">
<h4> </h4>
<ul>
<li><a href="#">one linkylink</a></li>
<li><a href="#">two linkylinks</a></li>
<li><a href="#">three linkylinks</a></li>
</ul>
</aside><!-- end of #third footer segment -->
<aside class="footer-segment last">
<h4> </h4>
<p>© 2010 <a href="#">www.yoursite.com</a></p>
</aside><!-- end of #fourth footer segment -->
</section><!-- end of footer-outer-block -->
</section><!-- end of footer-area -->
</footer>
</div><!-- #wrapper -->
<!-- Free template created by http//freehtml5templates.com -->
</body>
</html>
前端前端静态模板-非响应式黑粉白图片展示网站-学生作业毕设实训素材.zip （22个子文件） 
非响应式黑粉白图片展示网站 css 
movingbox.css 1KB style.css 1KB images 
p5.jpg 117KB p3.jpg 123KB
header.png 99KB leftarrow.png 1KB bg.png 8KB leftshadow.png 153B rightshadow.png 147B p2.jpg 60KB p1.jpg 63KB p4.jpg 99KB rightarrow.png 1KB
index.html 5KB js jquery.color-RGBa-patch.js 5KB example.js 2KB slider.js 3KB jquery-1.3.2.min.js 56KB jquery-1.3.1.min.js 54KB jquery.easing.1.3.js 8KB jquery.coda-slider-2.0.js 10KB styles.css 4KB资源评论
