File size: 11.4Kb
<!--A Design by W3layouts
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE HTML>
<html>
<head>
<title>Creation a industrial bootstrap for Iphone, Android Smartphone Mobile Website Template | Feature : w3layouts</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="keywords" content="The free Creation a industrial bootstrap Iphone web template, Andriod web template, Smartphone web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<!-- Bootstrap -->
<link href="smartphone/css/bootstrap.min.css" rel='stylesheet' type='text/css' />
<link href="smartphone/css/bootstrap.css" rel='stylesheet' type='text/css' />
<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.smartphone/js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- webfonts -->
<link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
<!-- // webfonts -->
<link href="smartphone/css/style.css" rel="stylesheet" type="text/css" media="all" />
<!-- start plugins -->
<script type="text/javascript" src="smartphone/js/jquery.min.js"></script>
<script type="text/javascript" src="smartphone/js/bootstrap.js"></script>
<!-- start light_box -->
<link rel="stylesheet" type="text/css" href="smartphone/css/jquery.fancybox.css" media="screen" />
<script type="text/javascript" src="smartphone/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="smartphone/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="smartphone/js/jquery.fancybox-1.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("div.fancyDemo a").fancybox();
});
</script>
<script>
$(document).ready(function(){
$(".dropdown").hover(
function() {
$('.dropdown-menu', this).stop( true, true ).slideDown("fast");
$(this).toggleClass('open');
},
function() {
$('.dropdown-menu', this).stop( true, true ).slideUp("fast");
$(this).toggleClass('open');
}
);
});
</script>
</head>
<body>
<div class="header_bg"><!-- start header -->
<div class="container-fluid">
<div class="row header">
<nav class="navbar" role="navigation">
<div class="container-fluid-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="smartphone/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="dropdown active">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Features<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="feature.html">Features 1</a></li>
<li><a href="feature.html">Features 2</a></li>
<li><a href="feature.html">Features 3</a></li>
</ul>
</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-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-fluid">
<div class="features"><!-- start feature -->
<div class="row features_list">
<div class="col-md-3 feature">
<div class="fancyDemo">
<a rel="group" title="" href="smartphone/images/ser_pic1.jpg"><img src="smartphone/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="smartphone/images/ser_pic2.jpg"><img src="smartphone/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="smartphone/images/ser_pic3.jpg"><img src="smartphone/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="smartphone/images/ser_pic4.jpg"><img src="smartphone/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="smartphone/images/ser_pic5.jpg"><img src="smartphone/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="smartphone/images/ser_pic6.jpg"><img src="smartphone/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="smartphone/images/ser_pic7.jpg"><img src="smartphone/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="smartphone/images/ser_pic8.jpg"><img src="smartphone/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-fluid">
<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="#">It is a long established fact that a reader will looking layout.</a></span>
<span><a href="#">There are many variations of passages of Lorem Ipsum available words.</a></span>
<span><a href="#">It is a long established fact that a reader will looking layout.</a></span>
</div>
<div class="col-md-3 span1_of_4">
<h4>photostream</h4>
<ul class="f_nav list-unstyled">
<li><a href="#"><img src="smartphone/images/f_pic1.jpg" alt="" class="img-responsive"/></a></li>
<li><a href="#"><img src="smartphone/images/f_pic3.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic4.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic5.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic7.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic1.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic6.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic8.jpg" alt="" class="img-responsive"/> </a></li>
<li><a href="#"><img src="smartphone/images/f_pic2.jpg" alt="" class="img-responsive"/> </a></li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<div class="footer_btm"><!-- start footer_btm -->
<div class="container-fluid">
<div class="row footer1">
<div class="col-md-5">
<div class="soc_icons text-center">
<ul class="list-unstyled">
<li><a class="icon1" href="#"></a></li>
<li><a class="icon2" href="#"></a></li>
<li><a class="icon3" href="#"></a></li>
<li><a class="icon4" href="#"></a></li>
<li><a class="icon5" href="#"></a></li>
<div class="clearfix"></div>
</ul>
</div>
</div>
<div class="col-md-7 copy text-center">
<p class="link"><span>© All rights reserved | Design by <a href="http://w3layouts.com/"> W3Layouts</a></span></p>
</div>
</div>
</div>
</div>
</body>
</html>