<!DOCTYPE HTML>
<html>
<head>
<title>Home</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href='http://fonts.googleapis.com/css?family=Quattrocento+Sans' rel='stylesheet' type='text/css'>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--slider-->
<link href="css/slider.css" rel="stylesheet" type="text/css" media="all"/>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="js/jquery.nivo.slider.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>
</head>
<body>
<div class="btm_border">
<div class="h_bg">
<div class="wrap">
<div class="header">
<div class="logo">
<h1><a href="index.html"><img src="images/logo.png" alt=""></a></h1>
</div>
<div class="social-icons">
<ul>
<li><a class="facebook" href="#" target="_blank"> </a></li>
<li><a class="twitter" href="#" target="_blank"></a></li>
<li><a class="googleplus" href="#" target="_blank"></a></li>
<li><a class="pinterest" href="#" target="_blank"></a></li>
<li><a class="dribbble" href="#" target="_blank"></a></li>
<li><a class="vimeo" href="#" target="_blank"></a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class='h_btm'>
<div class='cssmenu'>
<ul>
<li class='active'><a href='index.html'><span>Home</span></a></li>
<li><a href='about.html'><span>About</span></a></li>
<li><a href='staff.html'><span>Staff</span></a></li>
<li class='has-sub'><a href='service.html'><span>Services</span></a></li>
<li class='last'><a href='contact.html'><span>Contact</span></a></li>
<div class="clear"></div>
</ul>
</div>
<div class="search">
<form>
<input type="text" value="">
<input type="submit" value="">
</form>
</div>
<div class="clear"></div>
</div>
</div>
</div>
</div>
<!------ Slider_bg ------------>
<div class="slider_bg">
<div class="wrap">
<!------ Slider------------>
<div class="slider">
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="images/banner1.jpg" data-thumb="images/1.jpg" alt="" />
<img src="images/banner2.jpg" data-thumb="images/2.jpg" alt="" />
<img src="images/banner3.jpg" data-thumb="images/3.jpg" alt="" />
</div>
</div>
</div>
<!------End Slider ------------>
<div class="grids_1_of_3">
<div class="grid_1_of_3 images_1_of_3">
<img src="images/icon1.jpg">
<h3>Lorem Ipsum is simply</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore pariatur.</p>
</div>
<div class="grid_1_of_3 images_1_of_3">
<img src="images/icon2.jpg">
<h3>Lorem Ipsum is simply</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore pariatur.</p>
</div>
<div class="grid_1_of_3 images_1_of_3">
<img src="images/icon3.jpg">
<h3>Lorem Ipsum is simply</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore pariatur.</p>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<!--main-->
<div class="main_bg">
<div class="wrap">
<div class="main">
<div class="content">
<h2>what our customer says</h2>
<h3>Lorem ipsum dolor sit amet, consectetur adipisicing</h3>
<p><a href="details.html"><img src="images/pic1.jpg"></a> Cadipisicing elit,Nam ornare vulputate risus,id volutpat elit porttitor non.In consequat nisi vel lectus dapibus sodales.Nam ornare vulputate risus, id volutpat elit porttitor non. In consequat nisi vel lectus dapibus sodales.Nam ornare vulputate risus, id volutpat elit porttitor non. In consequat nisi vel lectus dapibus sodales.Nam ornare vulputate risus, id volutpat elit porttitor non. In consequat nisi vel lectus dapibus sodales. Pellentesque habitant morbi tristique senectus Nam ornare vulputate risus, id volutpat elit porttitor non. In consequat nisi vel lectus dapibus sodales. PellentesqueNam ornare vulputate risus, id volutpat elit porttitor non. In consequat nisi vel lectus dapibus sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas Pellentesque habitant morbi tristique senectus et netus et malesuada fames. sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Nam ornare vulputate risus,id volutpat elit porttitor non. In consequat nisi vel lectus dapibus sodales.Nam ornare vulputate risus, id volutpat elit porttitor non.</p>
<div class="clear"></div>
</div>
</div>
</div>
<div class="main_btm">
<div class="wrap">
<div class="main">
<div class="gallery">
<h3>Our latest projects</h3>
<ul>
<li><a href="images/gallery1.jpg"><img src="images/gallery1.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery2.jpg"><img src="images/gallery2.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery3.jpg"><img src="images/gallery3.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery4.jpg"><img src="images/gallery4.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery4.jpg"><img src="images/gallery4.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery3.jpg"><img src="images/gallery3.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery5.jpg"><img src="images/gallery5.jpg" alt=""></a><a href="#"></a></li>
<li><a href="images/gallery6.jpg"><img src="images/gallery6.jpg" alt=""></a><a href="#"></a></li>
</ul>
</div>
<script type="text/javascript" src="js/jquery.lightbox.js"></script>
<link rel="stylesheet" type="text/css" href="css/lightbox.css" media="screen">
<script type="text/javascript">
$(function() {
$('.gallery a').lightBox();
});
</script>
<div class="terminals">
<h3>Testimonials</h3>
<p>sed tempor ipsum dolor sit amet,Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt aliqua. Ut enim ad minim veniam,consectetur adipisicing elit,sed do eiusmod tempor incididunt magna aliqua. </p>
<p>sed tempor Ipsum dolor sit amet,Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt aliqua. Ut enim ad minim veniam,consectetur adipisicing elit,sed do eiusmod tempor incididunt magna aliqua. </p>
<span><a href="#">- Lorem ipsum</a> USA.</span>
</div>
<div class="clear"> </div>
</div>
</div>
</div>
<!--footer-->
<div class="footer-bg">
<div class="wrap">
<div class="footer">
<div class="box1">
<h4 class="btm">What We Do</h4>
<p>The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. ions from the 1914 below for those by H. Rackham</p>
<p>The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those The standard chunk of Lorem Ipsum used since the 1500s is reproduced reproduced</p>
</div>
<div class="box1">
<h4 class="btm">Categories</h4>
<nav>
<ul>
<li><a href="">The standard chunk of Lorem Ipsum used since </a></li>
<li><a href="">Duis a augue ac libero euismod viverra sitth</a></li>
图书馆网站模板
需积分: 32 37 浏览量
2017-05-20
17:24:15
上传
评论 2
收藏 698KB ZIP 举报
图书馆网站模板HTML+CSS.zip （41个子文件） 
图书馆网站模板HTML+CSS 
index.html 9KB about.html 7KB images 
staff1.jpg 11KB
logo.psd 57KB
logo1.png 2KB
lightbox-btn-close.gif 336B search_h.png 629B banner1.jpg 126KB lightbox-ico-loading.gif 4KB pic3.jpg 25KB gallery1.jpg 8KB icon1.jpg 2KB gallery6.jpg 7KB pic1.jpg 9KB pic2.jpg 20KB icon3.jpg 3KB l-r-arrows.png 1KB gallery4.jpg 8KB gallery3.jpg 12KB social-icons.png 4KB lightbox-btn-next.gif 812B icon2.jpg 2KB gallery2.jpg 10KB search.png 629B banner2.jpg 98KB Thumbs.db 210KB banner3.jpg 108KB logo.png 3KB gallery5.jpg 5KB quotes_alt.png 273B pic4.jpg 21KB js jquery.nivo.slider.js 28KB jquery-1.9.0.min.js 91KB jquery.lightbox.js 19KB staff.html 6KB 404.html 4KB contact.html 6KB css lightbox.css 2KB style.css 18KB slider.css 3KB service.html 6KB资源评论
