加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
index - 副本.html 29.42 KB
一键复制 编辑 原始数据 按行查看 历史
李梦雅 提交于 2018-07-16 22:03 . 首页粗略设计
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ustora Demo</title>
<!-- Google Fonts -->
<link href='https://fonts.googleapis.com/css?family=Titillium+Web:400,200,300,700,600' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Raleway:400,100' rel='stylesheet' type='text/css'>
<!-- Bootstrap -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="css/font-awesome.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="css/responsive.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="header-area">
<div class="container">
<div class="row">
<div class="col-md-8">
<div class="user-menu">
<ul>
<li><a href="#"><i class="fa fa-user"></i> 我的书</a></li>
<li><a href="cart.html"><i class="fa fa-user"></i> 购物车</a></li>
<li><a href="checkout.html"><i class="fa fa-user"></i>结账 </a></li>
<li><a href="#"><i class="fa fa-user"></i> 登录</a></li>
</ul>
</div>
</div>
<div class="col-md-4">
<div class="header-right">
<ul class="list-unstyled list-inline">
<li class="dropdown dropdown-small">
<a data-toggle="dropdown" data-hover="dropdown" class="dropdown-toggle" href="#"><span class="key">currency :</span><span class="value">USD </span><b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">USD</a></li>
<li><a href="#">INR</a></li>
<li><a href="#">GBP</a></li>
</ul>
</li>
<li class="dropdown dropdown-small">
<a data-toggle="dropdown" data-hover="dropdown" class="dropdown-toggle" href="#"><span class="key">language :</span><span class="value">English </span><b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">English</a></li>
<li><a href="#">French</a></li>
<li><a href="#">German</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div> <!-- End header area -->
<div class="site-branding-area">
<div class="container">
<div class="row">
<div class="col-sm-6">
<div class="logo">
<h1><a href="./"><img src="img/logo.jpg"></a></h1>
</div>
</div>
<div class="col-sm-6">
<div class="shopping-item">
<a href="cart.html">Cart - <span class="cart-amunt">$100</span> <i class="fa fa-shopping-cart"></i> <span class="product-count">5</span></a>
</div>
</div>
</div>
</div>
</div> <!-- End site branding area -->
<div class="mainmenu-area">
<div class="container">
<div class="row">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="shop.html">Shop page</a></li>
<li><a href="single-product.html">Single product</a></li>
<li><a href="cart.html">Cart</a></li>
<li><a href="checkout.html">Checkout</a></li>
<li><a href="#">Category</a></li>
<li><a href="#">Others</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
</div> <!-- End mainmenu area -->
<div class="slider-area">
<!-- Slider -->
<div class="block-slider block-slider4">
<ul class="" id="bxslider-home4">
<li>
<img src="img/h4-slide.png" alt="Slide">
<div class="caption-group">
<h2 class="caption title">
iPhone <span class="primary">6 <strong>Plus</strong></span>
</h2>
<h4 class="caption subtitle">Dual SIM</h4>
<a class="caption button-radius" href="#"><span class="icon"></span>Shop now</a>
</div>
</li>
<li><img src="img/h4-slide2.png" alt="Slide">
<div class="caption-group">
<h2 class="caption title">
by one, get one <span class="primary">50% <strong>off</strong></span>
</h2>
<h4 class="caption subtitle">school supplies & backpacks.*</h4>
<a class="caption button-radius" href="#"><span class="icon"></span>Shop now</a>
</div>
</li>
<li><img src="img/h4-slide3.png" alt="Slide">
<div class="caption-group">
<h2 class="caption title">
Apple <span class="primary">Store <strong>Ipod</strong></span>
</h2>
<h4 class="caption subtitle">Select Item</h4>
<a class="caption button-radius" href="#"><span class="icon"></span>Shop now</a>
</div>
</li>
<li><img src="img/h4-slide4.png" alt="Slide">
<div class="caption-group">
<h2 class="caption title">
Apple <span class="primary">Store <strong>Ipod</strong></span>
</h2>
<h4 class="caption subtitle">& Phone</h4>
<a class="caption button-radius" href="#"><span class="icon"></span>Shop now</a>
</div>
</li>
</ul>
</div>
<!-- ./Slider -->
</div> <!-- End slider area -->
<div class="promo-area">
<div class="zigzag-bottom"></div>
<div class="container">
<div class="row">
<div class="col-md-3 col-sm-6">
<div class="single-promo promo1">
<i class="fa fa-refresh"></i>
<p>30 Days return</p>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="single-promo promo2">
<i class="fa fa-truck"></i>
<p>Free shipping</p>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="single-promo promo3">
<i class="fa fa-lock"></i>
<p>Secure payments</p>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="single-promo promo4">
<i class="fa fa-gift"></i>
<p>New products</p>
</div>
</div>
</div>
</div>
</div> <!-- End promo area -->
<div class="maincontent-area">
<div class="zigzag-bottom"></div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="latest-product">
<h2 class="section-title">Latest Products</h2>
<div class="product-carousel">
<div class="single-product">
<div class="product-f-image">
<img src="img/product-1.jpg" alt="">
<div class="product-hover">
<a href="#" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i> Add to cart</a>
<a href="single-product.html" class="view-details-link"><i class="fa fa-link"></i> See details</a>
</div>
</div>
<h2><a href="single-product.html">Samsung Galaxy s5- 2015</a></h2>
<div class="product-carousel-price">
<ins>$700.00</ins> <del>$100.00</del>
</div>
</div>
<div class="single-product">
<div class="product-f-image">
<img src="img/product-2.jpg" alt="">
<div class="product-hover">
<a href="#" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i> Add to cart</a>
<a href="single-product.html" class="view-details-link"><i class="fa fa-link"></i> See details</a>
</div>
</div>
<h2>Nokia Lumia 1320</h2>
<div class="product-carousel-price">
<ins>$899.00</ins> <del>$999.00</del>
</div>
</div>
<div class="single-product">
<div class="product-f-image">
<img src="img/product-3.jpg" alt="">
<div class="product-hover">
<a href="#" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i> Add to cart</a>
<a href="single-product.html" class="view-details-link"><i class="fa fa-link"></i> See details</a>
</div>
</div>
<h2>LG Leon 2015</h2>
<div class="product-carousel-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-product">
<div class="product-f-image">
<img src="img/product-4.jpg" alt="">
<div class="product-hover">
<a href="#" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i> Add to cart</a>
<a href="single-product.html" class="view-details-link"><i class="fa fa-link"></i> See details</a>
</div>
</div>
<h2><a href="single-product.html">Sony microsoft</a></h2>
<div class="product-carousel-price">
<ins>$200.00</ins> <del>$225.00</del>
</div>
</div>
<div class="single-product">
<div class="product-f-image">
<img src="img/product-5.jpg" alt="">
<div class="product-hover">
<a href="#" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i> Add to cart</a>
<a href="single-product.html" class="view-details-link"><i class="fa fa-link"></i> See details</a>
</div>
</div>
<h2>iPhone 6</h2>
<div class="product-carousel-price">
<ins>$1200.00</ins> <del>$1355.00</del>
</div>
</div>
<div class="single-product">
<div class="product-f-image">
<img src="img/product-6.jpg" alt="">
<div class="product-hover">
<a href="#" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i> Add to cart</a>
<a href="single-product.html" class="view-details-link"><i class="fa fa-link"></i> See details</a>
</div>
</div>
<h2><a href="single-product.html">Samsung gallaxy note 4</a></h2>
<div class="product-carousel-price">
<ins>$400.00</ins>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> <!-- End main content area -->
<div class="brands-area">
<div class="zigzag-bottom"></div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="brand-wrapper">
<div class="brand-list">
<img src="img/brand1.png" alt="">
<img src="img/brand2.png" alt="">
<img src="img/brand3.png" alt="">
<img src="img/brand4.png" alt="">
<img src="img/brand5.png" alt="">
<img src="img/brand6.png" alt="">
<img src="img/brand1.png" alt="">
<img src="img/brand2.png" alt="">
</div>
</div>
</div>
</div>
</div>
</div> <!-- End brands area -->
<div class="product-widget-area">
<div class="zigzag-bottom"></div>
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="single-product-widget">
<h2 class="product-wid-title">Top Sellers</h2>
<a href="" class="wid-view-more">View All</a>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-1.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Sony Smart TV - 2015</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-2.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Apple new mac book 2015</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-3.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Apple new i phone 6</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="single-product-widget">
<h2 class="product-wid-title">Recently Viewed</h2>
<a href="#" class="wid-view-more">View All</a>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-4.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Sony playstation microsoft</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-1.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Sony Smart Air Condtion</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-2.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Samsung gallaxy note 4</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="single-product-widget">
<h2 class="product-wid-title">Top New</h2>
<a href="#" class="wid-view-more">View All</a>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-3.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Apple new i phone 6</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-4.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Samsung gallaxy note 4</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
<div class="single-wid-product">
<a href="single-product.html"><img src="img/product-thumb-1.jpg" alt="" class="product-thumb"></a>
<h2><a href="single-product.html">Sony playstation microsoft</a></h2>
<div class="product-wid-rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
<div class="product-wid-price">
<ins>$400.00</ins> <del>$425.00</del>
</div>
</div>
</div>
</div>
</div>
</div>
</div> <!-- End product widget area -->
<div class="footer-top-area">
<div class="zigzag-bottom"></div>
<div class="container">
<div class="row">
<div class="col-md-3 col-sm-6">
<div class="footer-about-us">
<h2>u<span>Stora</span></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perferendis sunt id doloribus vero quam laborum quas alias dolores blanditiis iusto consequatur, modi aliquid eveniet eligendi iure eaque ipsam iste, pariatur omnis sint! Suscipit, debitis, quisquam. Laborum commodi veritatis magni at?</p>
<div class="footer-social">
<a href="#" target="_blank"><i class="fa fa-facebook"></i></a>
<a href="#" target="_blank"><i class="fa fa-twitter"></i></a>
<a href="#" target="_blank"><i class="fa fa-youtube"></i></a>
<a href="#" target="_blank"><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="footer-menu">
<h2 class="footer-wid-title">User Navigation </h2>
<ul>
<li><a href="#">My account</a></li>
<li><a href="#">Order history</a></li>
<li><a href="#">Wishlist</a></li>
<li><a href="#">Vendor contact</a></li>
<li><a href="#">Front page</a></li>
</ul>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="footer-menu">
<h2 class="footer-wid-title">Categories</h2>
<ul>
<li><a href="#">Mobile Phone</a></li>
<li><a href="#">Home accesseries</a></li>
<li><a href="#">LED TV</a></li>
<li><a href="#">Computer</a></li>
<li><a href="#">Gadets</a></li>
</ul>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="footer-newsletter">
<h2 class="footer-wid-title">Newsletter</h2>
<p>Sign up to our newsletter and get exclusive deals you wont find anywhere else straight to your inbox!</p>
<div class="newsletter-form">
<form action="#">
<input type="email" placeholder="Type your email">
<input type="submit" value="Subscribe">
</form>
</div>
</div>
</div>
</div>
</div>
</div> <!-- End footer top area -->
<div class="footer-bottom-area">
<div class="container">
<div class="row">
<div class="col-md-8">
<div class="copyright">
<p>Copyright &copy; 2015.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
</div>
</div>
<div class="col-md-4">
<div class="footer-card-icon">
<i class="fa fa-cc-discover"></i>
<i class="fa fa-cc-mastercard"></i>
<i class="fa fa-cc-paypal"></i>
<i class="fa fa-cc-visa"></i>
</div>
</div>
</div>
</div>
</div> <!-- End footer bottom area -->
<!-- Latest jQuery form server -->
<script src="https://code.jquery.com/jquery.min.js"></script>
<!-- Bootstrap JS form CDN -->
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<!-- jQuery sticky menu -->
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<!-- jQuery easing -->
<script src="js/jquery.easing.1.3.min.js"></script>
<!-- Main Script -->
<script src="js/main.js"></script>
<!-- Slider -->
<script type="text/javascript" src="js/bxslider.min.js"></script>
<script type="text/javascript" src="js/script.slider.js"></script>
</body>
</html>
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化