<!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=Lato:100,300,400,700,900' rel='stylesheet' type='text/css'>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/owl.carousel.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/magnific-popup.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script src="js/owl.carousel.js"></script>
<script>
$(document).ready(function() {
$("#owl-demo").owlCarousel({
items : 4,
lazyLoad : true,
autoPlay : true,
navigation : true,
navigationText : ["", ""],
rewindNav : false,
scrollPerPage : false,
pagination : false,
paginationNumbers : false,
});
});
</script>
<!-- //Owl Carousel Assets -->
<!-----768px-menu----->
<link type="text/css" rel="stylesheet" href="css/jquery.mmenu.all.css" />
<script type="text/javascript" src="js/jquery.mmenu.js"></script>
<script type="text/javascript">
// The menu on the left
$(function() {
$('nav#menu-left').mmenu();
});
</script>
<!-----//768px-menu----->
</head>
<body>
<!-- start header -->
<div class="header_bg">
<div class="wrap">
<div class="header">
<div class="logo">
<a href="index.html">
<img src="images/lg.png" alt=""/>
<h1>ERACLE</h1>
<div class="clear"> </div>
</a>
</div>
<div class="text">
<p>Lorem Ipsum is simply dummy text of the printing</p>
</div>
<div class="clear"> </div>
</div>
</div>
</div>
<!-- start header -->
<div class="header_btm">
<div class="wrap">
<!------start-768px-menu---->
<div id="page">
<div id="header">
<a class="navicon" href="#menu-left"> </a>
</div>
<nav id="menu-left">
<ul>
<li class="active"><a href="index.html">Home</a></li>
<li><a href="about.html">About us</a></li>
<li><a href="services.html">Service</a></li>
<li><a href="pages.html">Pages</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</nav>
</div>
<!------start-768px-menu---->
<div class="header_sub">
<div class="h_menu">
<ul>
<li class="active"><a href="index.html">Home</a></li>
<li><a href="about.html">About us</a></li>
<li><a href="services.html">Service</a></li>
<li><a href="pages.html">Pages</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</div>
<div class="h_search">
<form>
<input type="text" value="" placeholder="search something...">
<input type="submit" value="">
</form>
</div>
<div class="clear"> </div>
</div>
</div>
</div>
<!---start-banner---->
<div class="banner" id="move-top">
<!----start-image-slider---->
<div data-scroll-reveal="enter bottom but wait 0.7s" class="img-slider" id="home">
<div class="wrap">
<div class="slider">
<ul id="jquery-demo">
<li>
<a href="#slide1">
</a>
<div data-scroll-reveal="enter bottom but wait 0.7s" class="slider-detils">
<h3>Lorem ipsum dolor sit amet.</h3>
<span>consectetur adipisc ing elit</span>
</div>
</li>
<li>
<a href="#slide2">
</a>
<div data-scroll-reveal="enter bottom but wait 1s" class="slider-detils">
<h3>Lorem Ipsum has been the industry's</h3>
<span>Aliquam viverra consectetur nibh a blan dit.</span>
</div>
</li>
<li>
<a href="#slide3">
</a>
<div data-scroll-reveal="enter bottom but wait 1.5s" class="slider-detils">
<h3>There are many variations of passages </h3>
<span>Proin at amet consectetur adipisc lacinia.</span>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="clear"> </div>
</div>
<!---slider---->
<link rel="stylesheet" href="css/slippry.css">
<script src="js/jquery-ui.js" type="text/javascript"></script>
<script src="js/scripts-f0e4e0c2.js" type="text/javascript"></script>
<script>
jQuery('#jquery-demo').slippry({
// general elements & wrapper
slippryWrapper: '<div class="sy-box jquery-demo" />', // wrapper to wrap everything, including pager
// options
adaptiveHeight: false, // height of the sliders adapts to current slide
useCSS: false, // true, false -> fallback to js if no browser support
autoHover: false,
transition: 'fade'
});
</script>
<!---scrooling-script--->
<!----//End-image-slider---->
<div class="simple-text">
<div class="wrap">
<h4>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</h4>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
<div class="Recent-wroks"><!-- start services -->
<div class="wrap">
<div class="Recent-wrok">
<h5 class="heading">Recent wrok</h5>
<!----start-img-cursual---->
<div id="owl-demo" class="owl-carousel">
<div class="item">
<div class="cau_left">
<div id="nivo-lightbox-demo"> <p> <a href="images/11.jpg" data-lightbox-gallery="gallery1" id="nivo-lightbox-demo"> <span class="rollover"> </span></a> </p></div>
<img src="images/1.jpg" >
</div>
<div class="cau_left">
<h4><a href="#">Lorem ipsum</a></h4>
<p>
Lorem ipsum dolor amet,consectetur adipisicing elit, sed do eiusmod tempor incididunt dolore magna aliqua.
</p>
</div>
</div>
<div class="item">
<div class="cau_left">
<div id="nivo-lightbox-demo"> <p> <a href="images/22.jpg" data-lightbox-gallery="gallery1" id="nivo-lightbox-demo"> <span class="rollover"> </span></a> </p></div>
<img src="images/2.jpg" >
</div>
<div class="cau_left">
<h4><a href="#">Lorem ipsum</a></h4>
<p>
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium,
</p>
</div>
</div>
<div class="item">
<div class="cau_left">
<div id="nivo-lightbox-demo"> <p> <a href="images/33.jpg" data-lightbox-gallery="gallery1" id="nivo-lightbox-demo"> <span class="rollover"> </span></a> </p></div>
<img src="images/3.jpg" >
</div>
<div class="cau_left">
<h4><a href="#">Lorem ipsum</a></h4>
<p>
On the other hand, we denounce with righteous indignation and dislike men who are so beguiled pleasure of the moment,
</p>
</div>
</div>
<div class="item">
<div class="cau_left">
<div id="nivo-lightbox-demo"> <p> <a href="images/44.jpg" data-lightbox-gallery="gallery1" id="nivo-lightbox-demo"> <span class="rollover"> </span></a> </p></div>
<img src="images/4.jpg" >
</div>
<div class="cau_left">
<h4><a href="#">Lorem ipsum</a></h4>
<p>
Lorem ipsum dolor amet,consectetur adipisicing elit, sed do eiusmod tempor incididunt dolore magna aliqua.
</p>
</div>
</div>
<div class="item">
<div clas
前端前端静态模板-个人展示-学生作业毕设实训素材.zip
版权申诉
78 浏览量
2022-04-07
22:08:56
上传
评论
收藏 4.9MB ZIP 举报
前端前端静态模板-个人展示-学生作业毕设实训素材.zip （87个子文件） 
个人展示 css 
magnific-popup.css 10KB owl.carousel.css 10KB jquery.mmenu.all.css 41KB slippry.css 17KB style.css 48KB
services.html 8KB images 
pagenate5.png 2KB arrow_btnh.png 239B
g22.jpg 35KB g5.jpg 71KB search_h.png 623B next.png 3KB g11.jpg 116KB banner.jpg 287KB 2.jpg 68KB g9.jpg 116KB 1.jpg 69KB g44.jpg 239KB prs1.jpg 57KB g77.jpg 132KB prev.png 3KB nav-icon.png 3KB comment1.png 3KB 3.jpg 77KB im1.jpg 139KB g1.jpg 132KB g99.jpg 211KB g88.jpg 249KB pagenate1.png 2KB g33.jpg 215KB sb1.jpg 89KB icon_2.png 221B saxda.jpg 61KB search.png 623B sb6.jpg 156KB im.jpg 177KB msg.png 381B prs2.jpg 61KB 11.jpg 345KB share_icon1.png 12KB c-arrows.png 667B g55.jpg 144KB sb3.jpg 80KB icon_1.png 3KB 4.jpg 95KB close.png 3KB img.jpg 44KB 22.jpg 251KB 33.jpg 312KB icon2.png 426B sb4.jpg 89KB pagenate.png 1KB msg1.png 381B view.png 890B icon1.png 305B m.png 516B lg.png 2KB g4.jpg 121KB comment.png 3KB g6.jpg 105KB marker21.png 3KB u.png 441B icon1 (1).png 305B spriteimg.png 11KB avator.png 3KB marker211.png 3KB sb5.jpg 66KB g8.jpg 34KB g66.jpg 211KB arrow_btn.png 239B g3.jpg 98KB icon3.png 538B 44.jpg 189KB g2.jpg 70KB g7.jpg 66KB pages.html 16KB index.html 18KB js jquery.mmenu.js 22KB jquery.min.js 91KB jquery-ui.js 426KB nivo-lightbox.min.js 7KB scripts-f0e4e0c2.js 19KB owl.carousel.js 37KB script.js 4KB blog.html 13KB about.html 11KB contact.html 6KB资源评论
