女性时装商城网页模板免费下载

模板描述：时尚街拍搭配 商城网站 模板下载，时尚街拍搭配的商城网站模板下载html模板下载

代码部署教程

1. 引入CSS

<link href=”css/bootstrap.css” rel=’stylesheet’ type=’text/css’ media=”all” />
<link href=”css/style.css” rel=’stylesheet’ type=’text/css’ media=”all” />

<link href=’http://fonts.useso.com/css?family=Lato:100,300,400,700,900′ rel=’stylesheet’ type=’text/css’>

<link rel=”stylesheet” href=”css/sticky-navigation.css” />

<link href=”css/demo.css” rel=”stylesheet” type=”text/css” />

2. 引入JS

<script src=”js/jquery-1.11.0.min.js”>
</script>

<script type=”text/javascript” src=”js/jquery.flexisel.js”>

</script>

<script src=’http://v7.cnzz.com/stat.php?id=155540&web_id=155540′ language=’JavaScript’ charset=’gb2312′>

</script>

3. HTML代码

<!– Header Part Starts Here –>
<div class=”header”>

<div class=”container”>

<div id=”demo_top_wrapper”>

<div id=”sticky_navigation_wrapper”>

<div id=”sticky_navigation”>

<div class=”demo_container navigation-bar”>

<div class=”navigation”>

<div class=”logo”>

<a href=”index.html”>

SH</a>

</div>

<span class=”menu”>

</span>

<script>

$( “span.menu” ).click(function() {
$( “.navig” ).slideToggle( “slow”, function() {
// Animation complete.
});
});
</script>

<div class=”navig”>

<ul>

<li>

<a href=”women.html”>

Woman</a>

</li>

<li>

<a href=”men.html”>

Men</a>

</li>

<li>

<a href=”#”>

Kids</a>

</li>

<li>

<a href=”#”>

Comming Soon</a>

</li>

<li>

<a href=”about.html”>

About</a>

</li>

</ul>

</div>

<div class=”clearfix”>

</div>

</div>

<div class=”navigation-right”>

<ul class=”user”>

<li>

<span>

</span>

<a href=”login.html”>

Log In</a>

</li>

<li>

<span class=”bascket”>

</span>

<a href=”bascket.html”>

Basket(0)</a>

</li>

<li>

<button class=”search”>

</button>

</li>

</ul>

</div>

<div class=”clearfix”>

</div>

<div class=”serch”>

<span>

<input type=”text” placeholder=”Search” required=””>

<input type=”submit” value=”” />

</span>

</div>

<script>

$( “button.search” ).click(function() {
$( “.serch” ).slideToggle( “slow”, function() {
// Animation complete.
});
});
</script>

<div class=”clearfix”>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class=”container”>

<section id=”main”>

<div class=”content”>

<!– Banner Starts Here —>

<div class=”banner”>

<h1>

Hazy Shade of spring</h1>

<small>

Quisque lorem tortor fringilla sed, vestibulum id, eleifend justo.</small>

<div class=”ban-btn”>

<a href=”#”>

check new arrivals</a>

</div>

</div>

<!– Banner Ends Here —>

<!– Gallery Starts Here —>

<div class=”gallery”>

<div class=”gallery-row”>

<div class=”gallery-grid”>

<div class=”grid-top img-pos”>

<img src=”images/p1.jpg” alt=”” class=”img-responsive”>

<div class=”img-caption”>

<p>

HEATHER <br>

GREY BASICS</p>

<small>

New Arrival</small>

</div>

</div>

<div class=”grid-bot img-pos”>

<img src=”images/p2.jpg” alt=”” class=”img-responsive”>

<div class=”img-caption”>

</div>

</div>

</div>

<div class=”gallery-grid1″>

<div class=”grid1-row1″>

<div class=”g1-r2″>

<div class=”twit t-wit”>

<span class=”line”>

</span>

<i class=”twit-icon”>

</i>

<span class=”line”>

</span>

<p>

Opening Ceremony @IndonesiaFW tomorrow, PMers! Are you ready for the biggest fashion movement in</p>

<small>

@PuspitaMarthaID </small>

</div>

<div class=”twit img-pos”>

<img src=”images/p3.jpg” alt=”” class=”img-responsive”>

<div class=”img-caption”>

</div>

</div>

<div class=”clearfix”>

</div>

</div>

<div class=”g1-r2″>

<div class=”twit img-pos”>

<img src=”images/p4.jpg” alt=”” class=”img-responsive”>

<div class=”img-caption jk-t”>

<p>

chuck taylors</p>

<small>

$125.00</small>

</div>

</div>

<div class=”twit t-wit”>

<span class=”line”>

</span>

<i class=”twit-icon”>

</i>

<span class=”line”>

</span>

<p>

Girls, Girls, Girls: A Look Back at 50 Years of the Pirelli Calendar</p>

<small>

@Vogue</small>

</div>

<div class=”clearfix”>

</div>

</div>

<div class=”clearfix”>

</div>

</div>

<div class=”grid1-row2″>

<div class=”twit t-hat”>

<i class=”aarow”>

</i>

<p>

Jaxon Hat</p>

<small>

Beanie Hat</small>

</div>

<div class=”twit img-pos”>

<img src=”images/p5.jpg” alt=”” class=”img-responsive”>

<div class=”img-caption jk-t”>

<p>

basic blazer</p>

<small>

from $199.00</small>

</div>

</div>

<div class=”clearfix”>

</div>

</div>

</div>

<div class=”gallery-grid”>

<div class=”grid-bot t-hat”>

<i class=”aarow”>

</i>

<p>

elegant shoes</p>

<small>

BRAIDED LEATHER</small>

</div>

<div class=”grid-top img-pos”>

<img src=”images/p6.jpg” alt=”” class=”img-responsive respon”>

<div class=”img-caption”>

<p>

jeans for<br>

ADVENTURE</p>

<small>

New Arrival</small>

</div>

</div>

</div>

<div class=”clearfix”>

</div>

</div>

</div>

<!– Gallery Ends Here —>

<!— Subscribe Bar Starts here –>

<div class=”subscribe”>

<h2>

sign up to receive our updates</h2>

<p>

Nulla ipsum dolor lacus, suscipit adipiscing. Cum sociis natoque penatibus et ultrices volutpat.</p>

<div class=”sub-bar”>

<span>

<input type=”text” placeholder=”Your e-mail” required=”” />

<input type=”submit” value=”add” />

</span>

</div>

</div>

<!— Subscribe Bar Ends here –>

<!– Partners Starts Here —>

<div class=”partner”>

<ul id=”flexiselDemo3″>

<li>

<img src=”images/ss1.jpg” class=”img-responsive” alt=””/>

</li>

<li>

<img src=”images/ss2.jpg” class=”img-responsive” alt=””/>

</li>

<li>

<img src=”images/ss3.jpg” class=”img-responsive” alt=””/>

</li>

<li>

<img src=”images/ss4.jpg” class=”img-responsive” alt=””/>

</li>

<li>

<img src=”images/ss5.png” class=”img-responsive” alt=””/>

</li>

</ul>

<script type=”text/javascript”>

$(window).load(function() {
$(“#flexiselDemo3″).flexisel({
visibleItems: 5,
animationSpeed: 1000,
autoPlay: true,
autoPlaySpeed: 3000,
pauseOnHover: true,
enableResponsiveBreakpoints: true,
responsiveBreakpoints: {
portrait: {
changePoint:480,
visibleItems: 1
},
landscape: {
changePoint:640,
visibleItems: 2
},
tablet: {
changePoint:768,
visibleItems: 3
}
}
});
});
</script>

</div>

<!– Partners Ends Here —>

<!– Footer Menu Starts here —>

<div class=”footer”>

<div class=”row footer-row”>

<div class=”col-md-3 footer-col”>

<h2 class=”ft-title”>

Collection</h2>

<ul class=”ft-list”>

<li>

<a href=”#”>

Woman (1725)</a>

</li>

<li>

<a href=”#”>

Men (635)</a>

</li>

<li>

<a href=”#”>

Kids (2514</a>

</li>

<li>

<a href=”#”>

Comming Soon (76)</a>

</li>

</ul>

</div>

<div class=”col-md-3 footer-col”>

<h2 class=”ft-title”>

site</h2>

<ul class=”ft-list list-h”>

<li>

<a href=”#”>

Terms of Service </a>

</li>

<li>

<a href=”#”>

Privacy Policy </a>

</li>

<li>

<a href=”#”>

Copyright Policy </a>

</li>

<li>

<a href=”#”>

Press Kit</a>

</li>

<li>

<a href=”#”>

Support</a>

</li>

</ul>

</div>

<div class=”col-md-3 footer-col”>

<h2 class=”ft-title”>

Shop</h2>

<ul class=”ft-list list-h”>

<li>

<a href=”#”>

About us</a>

</li>

<li>

<a href=”#”>

Shipping Metods</a>

</li>

<li>

<a href=”#”>

Career</a>

</li>

<li>

<a href=”contact.html”>

Contact</a>

</li>

</ul>

</div>

<div class=”col-md-3 foot-cl”>

<h2 class=”ft-title”>

social</h2>

<p>

Shoper is made with love in Warsaw,<br>

Copyright &copy; 2014.Company name All rights reserved.<a target=”_blank” href=”http://www.cxvn.com//moban/”>

网页模板</a>

</p>

<ul class=”social”>

<li>

<i class=”fa”>

</i>

</li>

<li>

<i class=”tw”>

</i>

</li>

<li>

<i class=”is”>

</i>

</li>

</ul>

</div>

<div class=”clearfix”>

</div>

</div>

</div>

<!– Footer Menu Ends here —>

</div>

</section>

</div>

<!– Header Part Starts Here –>

<div style=”display:none”>

<script src=’http://v7.cnzz.com/stat.php?id=155540&web_id=155540′ language=’JavaScript’ charset=’gb2312′>

</script>

</div>

下载地址

立即下载