<!DOCTYPE HTML>
<html>
<head>
<title>Features</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel='stylesheet' type='text/css' />
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--[if lt IE 9]>
<script src="https//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https//oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- webfonts -->
<link href='http//fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
<!-- // webfonts -->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!-- start plugins -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- start light_box -->
<link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css" media="screen" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("div.fancyDemo a").fancybox();
});
</script>
</head>
<body>
<div class="header_bg"><!-- start header -->
<div class="container">
<div class="row header">
<nav class="navbar" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><img src="images/logo.png" alt="" class="img-responsive"/> </a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="menu nav navbar-nav ">
<li><a href="index.html">home</a></li>
<li class="active"><a href="feature.html">features</a></li>
<li><a href="blog.html">blog</a></li>
<li><a href="about.html">about</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
<form class="navbar-form navbar-right" role="search">
<div class="form-group my_search">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default">Search</button>
</form>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
</div>
<ol class="breadcrumb">
<li><a href="index.html">Home</a></li>
<li class="active">features</li>
</ol>
</div>
</div>
<div class="main"><!-- start main -->
<div class="container">
<div class="features"><!-- start feature -->
<div class="row features_list">
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic1.jpg"><img src="images/ser_pic1.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</p>
<a href="single-page.html"> consectetur lipsum</a>
</div>
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic2.jpg"><img src="images/ser_pic2.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<a href="single-page.html">Lorem Ipsum simply</a>
</div>
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic3.jpg"><img src="images/ser_pic3.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</p>
<a href="single-page.html"> consectetur lipsum</a>
</div>
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic4.jpg"><img src="images/ser_pic4.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<a href="single-page.html">Lorem Ipsum simply</a>
</div>
</div>
<div class="row features_list1"><!-- start feature -->
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic5.jpg"><img src="images/ser_pic5.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</p>
<a href="single-page.html">Lorem Ipsum simply</a>
</div>
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic6.jpg"><img src="images/ser_pic6.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<a href="single-page.html"> consectetur lipsum</a>
</div>
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic7.jpg"><img src="images/ser_pic7.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour.</p>
<a href="single-page.html">Lorem Ipsum simply</a>
</div>
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="images/ser_pic8.jpg"><img src="images/ser_pic8.jpg" alt=""class="img-responsive"/></a>
</div>
<p class="para">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<a href="single-page.html"> consectetur lipsum</a>
</div>
</div>
</div><!-- end feature -->
</div>
</div>
<div class="footer_bg"><!-- start footre -->
<div class="container">
<div class="row footer">
<div class="col-md-3 span1_of_4">
<h4>about us</h4>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry .....</p>
<h5>Address</h5>
<p class="top">500 Lorem Ipsum Dolor Sit,</p>
<p>22-56-2-9 Sit Amet,</p>
<p>USA</p>
<p>Phone:(00) 222 666 444</p>
<p>Fax: (000) 000 00 00 0</p>
</div>
<div class="col-md-3 span1_of_4">
<h4>latest posts</h4>
<span><a href="#"> Fusce scelerisque massa vitae </a></span>
<p>25 april 2013</p>
<span><a href="#">Pellentesque bibendum ante </a></span>
<p>15 march 2013</p>
<span><a href="#">Maecenas quis ipsum sed magna </a></span>
<p>25 april 2013</p>
</div>
<div class="col-md-3 span1_of_4">
<h4>latest comments</h4>
<span><a href
没有合适的资源?快使用搜索试试~ 我知道了~
Web网页开发中HTML、CSS、JS的网页设计模板(6)
共46个文件
jpg:21个
png:9个
js:6个
需积分: 0 1 下载量 21 浏览量
2024-02-16
21:58:03
上传
评论
收藏 800KB RAR 举报
温馨提示
内容概要:通过学习资源内交互体验技巧和优秀的设计案例,了解最新的设计趋势。基于HTML、CSS、JS的技术,包括菜单栏、页面布局、动态效果以及页面跳转等功能。帮助你提升网页设计技能,创造出引人注目的网页作品。 适合人群:不仅适合刚入门的设计师,也适用于经验丰富的专业人士。此资源无论是刚入门还是经验丰富的设计师,都有适合的模板用来借鉴和学习。 可以学到的知识:①Web设计方法,轻松搭建令人惊艳的网页。②各种类型的设计模板,包括响应式布局、交互动画、独特的配色方案和创新的界面设计等。③也可以学到如何巧妙运用这些模板。④最新的Web设计趋势并且提升技能和寻找灵感。⑤网页开发的小技巧、开发的细节知识。 阅读建议:此资源以Web开发为基础学习其原理和内核,不仅是代码编写实现也更注重内容上的需求分析和方案设计,所以在学习的过程要结合这些内容一起来实践,并调试对应的代码。
资源推荐
资源详情
资源评论
收起资源包目录
网页模板6.rar (46个子文件)
网页模板6
js
bootstrap.js 54KB
jquery-1.3.2.min.js 56KB
bootstrap.min.js 28KB
jquery.fancybox-1.2.1.js 15KB
jquery.easing.1.3.js 8KB
jquery.min.js 94KB
feature.html 10KB
css
style.css 15KB
bootstrap.min.css 98KB
bootstrap.css 118KB
jquery.fancybox.css 5KB
index.html 9KB
single-page.html 7KB
contact.html 8KB
about.html 8KB
images
ser_pic7.jpg 37KB
blog_pic1.jpg 39KB
f_pic6.jpg 2KB
det_pic.jpg 97KB
header_bg.jpg 32KB
fancy_right.png 2KB
f_pic4.jpg 2KB
icon1.png 1KB
logo.png 3KB
f_pic3.jpg 2KB
f_pic1.jpg 2KB
fancy_closebox.png 2KB
ser_pic2.jpg 32KB
ser_pic8.jpg 25KB
ser_pic1.jpg 34KB
pic1.png 168KB
f_pic2.jpg 2KB
f_pic8.jpg 2KB
ser_pic4.jpg 29KB
ser_pic3.jpg 39KB
ads_pic.jpg 495B
about_pic.jpg 34KB
icon3.png 2KB
ser_pic5.jpg 26KB
icons.png 1KB
ser_pic6.jpg 54KB
f_pic5.jpg 2KB
f_pic7.jpg 1KB
fancy_left.png 2KB
icon2.png 2KB
blog.html 9KB
共 46 条
- 1
资源评论
Simon学Java
- 粉丝: 214
- 资源: 12
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功