Scribd
Upload
59 views7 pages

Class Charset Content Name Content Name Content Rel Href Rel Href Rel Href Rel Href SRC

This document is the HTML code for a website template. It includes code for the website header, navigation bar, homepage content in a sliding banner, and an "About" page section. The homepage features three sliding panels that promote the template, discuss responsive design, and highlight mobile readiness. The navigation bar links to additional pages.

Uploaded by

Crash Zerocool
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
59 views7 pages

Class Charset Content Name Content Name Content Rel Href Rel Href Rel Href Rel Href SRC

This document is the HTML code for a website template. It includes code for the website header, navigation bar, homepage content in a sliding banner, and an "About" page section. The homepage features three sliding panels that promote the template, discuss responsive design, and highlight mobile readiness. The navigation bar links to additional pages.

Uploaded by

Crash Zerocool
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.

html Monday, August 10, 2015 6:54 PM

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Stream Responsive Template</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="css/normalize.css">


<link rel="stylesheet" href="css/font-awesome.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/templatemo-style.css">
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
</head>
<body>
<!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please
<a href="http://browsehappy.com/">upgrade your browser</a> to improve your
experience.</p>
<![endif]-->

<div id="home" class="carousel slide carousel-fade" data-ride="carousel">

<!-- Wrapper for slides -->


<div class="carousel-inner">
<div class="item active">
<div class="item-1"></div>
<div class="carousel-caption">
<div class="container">
<div class="col-md-offset-2 col-md-8 col-sm-12">
<h2>STREAM</h2>
<p><strong><span class="green">template</span><span
class="yellow">mo</span></strong>.com website provides a lot of
free responsive templates for everyone. You can download, edit
and apply this layout for any purpose. Please tell your friends
about our website. Thank you.</p>
<a href="#" class="button default">Details</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="item-2"></div>
<div class="carousel-caption">
<div class="container">
<div class="col-md-offset-2 col-md-8 col-sm-12">
<h2>Responsive Design</h2>
<p>Credit goes to <a rel="nofollow"
href="http://unsplash.com"><span

-1-
D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.html Monday, August 10, 2015 6:54 PM

class="yellow">Unsplash</span></a> for images used in this


template. Vivamus sed mauris ut libero tristique ultricies.
Suspendisse sagittis eget augue vel condimentum. Sed malesuada
tortor venenatis enim blandit interdum.</p>
<a href="#" class="button default">Read More</a>
</div>
</div>
</div>
</div>
<div class="item">
<div class="item-3"></div>
<div class="carousel-caption">
<div class="container">
<div class="col-md-offset-2 col-md-8 col-sm-12">
<h2>Mobile Ready</h2>
<p>Donec malesuada pellentesque cursus. In vestibulum metus sit
amet est elementum, et malesuada mi consequat. Sed ultricies
lectus sit amet venenatis condimentum. Morbi hendrerit posuere
enim at aliquet.</p>
<a href="#" class="button default">Let's talk</a>
</div>
</div>
</div>
</div>
</div>

<!-- SLIDER OPTIONS -->


<div class="slider-options">
<div class="container">
<div class="row">
<div class="col-md-4 col-sm-4 col-xs-4 slider-nav">
<!-- Controls -->
<a class="left carousel-control" href="#home" role="button"
data-slide="prev">
<span class="fa fa-angle-left"></span>
</a>
<a class="right carousel-control" href="#home" role="button"
data-slide="next">
<span class="fa fa-angle-right"></span>
</a>
</div>

<div class="col-md-4 col-sm-4 col-xs-4">


<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#home" data-slide-to="0" class="active"></li>
<li data-target="#home" data-slide-to="1"></li>
<li data-target="#home" data-slide-to="2"></li>
</ol>
</div>

<div class="col-md-4 col-sm-4 text-right col-xs-4">


<a href="#" id="scroll-to-content" class="go-down"><i class="fa

-2-
D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.html Monday, August 10, 2015 6:54 PM

fa-angle-down"></i></a>
</div>

</div>
</div>
</div>

</div> <!-- Carousel -->

<nav id="navigation">
<div class="navbar navbar-default navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">Stream</a>
</div>
<div class="navbar-collapse collapse">

<ul class="nav navbar-nav navbar-right">


<li><a href="#home" class="current">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#gallery">Gallery</a></li>
<li><a href="#contact">Contact</a></li>
</ul>

</div><!--/.nav-collapse -->
</div><!--/.container -->
</div><!--navbar-default-->
</nav><!--navigation section end here-->

<section id="about" class="page-section first-section">


<div class="container">
<div class="row page-heading">
<div class="col-md-8 col-sm-8">
<h3 class="page-title">About Me</h3>
<p class="page-subtitle">LEARN MORE ABOUT ME AND MY EXPERIENCE</p>
</div>
<div class="col-md-4 col-sm-4 hidden-xs page-icon-holder">
<p class="page-icon"><i class="fa fa-user"></i></p>
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12">
<div class="profile-image">
<img src="img/9.jpg" alt="">
</div>
</div>

-3-
D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.html Monday, August 10, 2015 6:54 PM

<div class="col-md-4 col-sm-6 col-xs-12">


<div class="profile-content">
<h4>Linda Perry</h4>
<span>Web Designer</span>
<p>Pellentesque elementum, lacus sit amet hendrerit posuere, quam
quam tristique nisi, nec ornare ligula magna id nisl. Donec blandit
enim ac semper facilisis. Curabitur eu laoreet mauris, eget
fermentum velit.</p>
<ul class="social-icons">
<li><a href="#" class="fa fa-facebook"></a></li>
<li><a href="#" class="fa fa-twitter"></a></li>
<li><a href="#" class="fa fa-linkedin"></a></li>
<li><a href="#" class="fa fa-rss"></a></li>
</ul>
</div>
</div>
<div class="col-md-4 col-sm-12 col-xs-12">
<div class="my-skills">
<h4>My Skills</h4>
<p>Etiam ac nisi sed velit tempor facilisis. Aenean pellentesque
mollis metus, non tincidunt odio maximus nec. Praesent felis ex,
elementum sed lobortis.</p>
<ul class="progess-bars">
<li>
<span>ANIMATIONS 85%</span>
<div class="progress">
<div class="progress-bar" role="progressbar"
aria-valuenow="85" aria-valuemin="0"
aria-valuemax="100" style="width: 85%;"></div>
</div>
</li>
<li>
<span>PHOTOSHOP 95%</span>
<div class="progress">
<div class="progress-bar" role="progressbar"
aria-valuenow="95" aria-valuemin="0"
aria-valuemax="100" style="width: 95%;"></div>
</div>
</li>
<li>
<span>MARKETING 40%</span>
<div class="progress">
<div class="progress-bar" role="progressbar"
aria-valuenow="40" aria-valuemin="0"
aria-valuemax="100" style="width: 40%;"></div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>

-4-
D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.html Monday, August 10, 2015 6:54 PM

<section id="gallery" class="page-section">


<div class="container">
<div class="row page-heading">
<div class="col-md-8 col-sm-8">
<h3 class="page-title">My Gallery</h3>
<p class="page-subtitle">CHECK SOME OF MY LAST PROJECTS</p>
</div>
<div class="col-md-4 col-sm-4 hidden-xs text-right">
<p class="page-icon"><i class="fa fa-camera"></i></p>
</div>
</div>
<div class="row">
<div class="gallery-holder">
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/1.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/2.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/3.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/4.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/5.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>

-5-
D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.html Monday, August 10, 2015 6:54 PM

</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/6.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/7.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12 gallery-item">
<div class="gallery-thumb">
<img src="img/8.jpg" alt="">
<div class="hover">
<a href="#" class="fa fa-plus"></a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>

<section id="contact" class="page-section">


<div class="container">
<div class="row page-heading">
<div class="col-md-8 col-sm-8">
<h3 class="page-title">Contact Me</h3>
<p class="page-subtitle">FEEL FREE TO SEND A MESSAGE</p>
</div>
<div class="col-md-4 col-sm-4 hidden-xs text-right">
<p class="page-icon"><i class="fa fa-envelope"></i></p>
</div>
</div>
<div class="row">
<div class="col-md-9 col-sm-12">
<div class="row">
<form action="#" method="post" class="contact-form">
<fieldset class="col-md-4 col-sm-6 col-xs-12">
<input type="text" id="name" placeholder="Name...">
</fieldset>
<fieldset class="col-md-4 col-sm-6 col-xs-12">
<input type="email" id="email" placeholder="Email...">
</fieldset>

-6-
D:\phpsampleSYS_TEM\templatemo_443_stream\templatemo_443_stream\index.html Monday, August 10, 2015 6:54 PM

<fieldset class="col-md-4 col-sm-12 col-xs-12">


<input type="text" id="subject" placeholder="Subject...">
</fieldset>
<fieldset class="col-md-12 col-sm-12 col-xs-12">
<textarea name="message" id="message" cols="30" rows="6"
placeholder="Message..."></textarea>
</fieldset>
<fieldset class="col-md-12 col-sm-12 col-xs-12">
<input type="submit" class="button default" value="Send
Message">
</fieldset>
</form>
</div>
</div>
<div class="col-md-3 col-sm-12">
<div class="contact-info">
<h4>Contact Information</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Phasellus varius aliquam diam, ac cursus enim. Ut interdum leo
mattis varius pulvinar.</p>
<ul class="social-icons">
<li><a href="#" class="fa fa-facebook"></a></li>
<li><a href="#" class="fa fa-twitter"></a></li>
<li><a href="#" class="fa fa-linkedin"></a></li>
<li><a href="#" class="fa fa-rss"></a></li>
</ul>
</div>
</div>
</div>
</div>
</section>

<footer class="site-footer">
<div class="container">
<div class="text-center">
<a href="#" class="go-top"><i class="fa fa-angle-up"></i></a>
<p class="copyright-text">Copyright &copy; 2084 Company Name</p>
</div>
</div>
</footer>

<script src="js/vendor/jquery-1.10.2.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/min/plugins.min.js"></script>
<script src="js/min/main.min.js"></script>

</body>
</html>

-7-

You might also like