硬件产品信息展示响应式网页模板.7z资源-CSDN文库

共60个文件

png：22个

jpg：10个

js：6个

HTML

web前端

网站源码

课程设计

JavaScript

需积分: 5 186 浏览量 2024-06-20 08:51:19 上传评论收藏 4.6MB 7Z 举报

资源推荐

资源详情

资源评论

收起资源包目录

硬件产品信息展示响应式网页模板.7z （60个子文件）

硬件产品信息展示响应式网页模板

html

promotion.html 6KB

bootstrap.min.js 31KB

jquery.gmap3.min.js 29KB

main.js 586B

vendor

jquery-1.10.1.min.js 91KB

modernizr-2.6.2.min.js 15KB

plugins.js 45KB

css

bootstrap.min.css 107KB

font-awesome.min.css 20KB

normalize.min.css 2KB

templatemo-style.css 21KB

index.html 11KB

contact.html 6KB

images

s2.png 11KB

contactbg.png 748KB

product1.png 42KB

filterbg.png 44KB

bg2.png 180KB

s4.png 15KB

slide2.jpg 332KB

previous.png 726B

loading.gif 10KB

s3.png 16KB

headerbg.png 150KB

p8.jpg 212KB

p4.jpg 150KB

p6.jpg 156KB

bg4.png 109KB

slide1.jpg 288KB

1.png 36KB

next.png 724B

bg3.png 452KB

socialbg.png 2KB

product2.png 38KB

bg1.png 167KB

close.png 835B

p7.jpg 128KB

p2.jpg 73KB

s1.png 13KB

p3.jpg 141KB

footerbg.png 3KB

bg_play_pause.png 2KB

p5.jpg 108KB

promotionbg.png 232KB

productsbg.png 375KB

p1.jpg 45KB

products.html 9KB

fonts

flexslider-icon.woff 1KB

FontAwesome.otf 73KB

glyphicons-halflings-regular.svg 61KB

glyphicons-halflings-regular.ttf 40KB

glyphicons-halflings-regular.woff 23KB

glyphicons-halflings-regular.eot 20KB

fontawesome-webfont.eot 71KB

flexslider-icon.eot 2KB

fontawesome-webfont.woff 82KB

flexslider-icon.ttf 2KB

fontawesome-webfont.svg 248KB

flexslider-icon.svg 2KB

fontawesome-webfont.ttf 138KB

<!DOCTYPE html>     <html class="no-js">  <head> <meta charset="utf-8"> <title>Stone Responsive Template</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width">   <link rel="stylesheet" href="css/bootstrap.min.css">  <link rel="stylesheet" href="css/font-awesome.min.css">  <link rel="stylesheet" href="css/normalize.min.css">  <link rel="stylesheet" href="css/templatemo-style.css"> <script src="js/vendor/modernizr-2.6.2.min.js"></script> </head> <body class="loading">   <div class="site-header"> <div class="container"> <div class="row"> <nav class="navbar navbar-default navbar-static-top"> <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#main-menu"> <span class="sr-only">Toggle navigation</span> <i class="fa fa-bars"></i> </button> <a class="navbar-brand" href="index.html">Stone</a> </div> <div class="collapse navbar-collapse" id="main-menu"> <ul class="nav navbar-nav navbar-right"> <li><a href="index.html">Home</a></li> <li><a href="promotion.html">Promotion</a></li> <li><a href="products.html">Products</a></li> <li><a href="contact.html">Contact</a></li> </ul> </div> </nav> </div> </div> </div>   <div class="site-slider"> <div class="flexslider"> <ul class="slides"> <li class="slide"> <div class="overlay"></div> <img src="images/slide1.jpg" alt=""> <div class="slider-caption"> <div class="title"> <h2>WEB DESIGN</h2> <h2>INSPIRATION</h2> </div> <a href="#" class="slider-button">Download</a> </div> </li> <li class="slide"> <div class="overlay"></div> <img src="images/slide2.jpg" alt=""> <div class="slider-caption"> <div class="title"> <h2>DEVELOPMENT</h2> <h2>TEMPLATEMO</h2> </div> <a href="#" class="slider-button">Read More</a> </div> </li> </ul> </div> </div>  <div class="first-section"> <div class="container"> <div class="row"> <div class="col-md-6"> <h3>Responsive Design</h3> <p>Stone template is provided by <a href="http://www.templatemo.com" target="_parent">templatemo</a> website. Credits go to Smashing Magazine for <a href="http://www.smashingmagazine.com/2012/11/20/art-professions-icons-png/">Art Professions Icon Set</a> and <a href="http://unsplash.com">Unsplash</a> for images. Praesent imperdiet orci se ante vehicula pulvinar. Morbi adipiscing molestie iaculis. Maecenas accumsan gravida est, quis placerat neque ullamcorper vitae. <br><br>Aenean cursus non neque at porta. Lorem ipsum dolor amet, consectetur adipiscing elit. Praesent massa justo, eleifend ut purus sed, pellentesque scelerisque ligula. Fusce ullamcorper rutrum est, nec ullamcorper velit cursus eget.</p> </div> <div class="col-md-6 text-center"> <div class="image-holder"> <img src="images/1.png" alt=""> </div> </div> </div> </div> </div> <div class="second-section"> <div class="container"> <div class="row"> <div class="col-md-3 col-sm-6 text-center"> <img src="images/s1.png" alt=""> <h4>DRAW THE SCATCH</h4> </div> <div class="col-md-3 col-sm-6 text-center"> <img src="images/s2.png" alt=""> <h4>MIX IT UP</h4> </div> <div class="col-md-3 col-sm-6 text-center"> <img src="images/s3.png" alt=""> <h4>TAKE A PHOTO</h4> </div> <div class="col-md-3 col-sm-6 text-center"> <img src="images/s4.png" alt=""> <h4>PREVIEW PRINT</h4> </div> </div> </div> </div> <div class="third-section"> <div class="container"> <div class="row"> <div class="col-md-6"> <h2>First Procedure</h2> <span>(Pellentesque ligula lectus)</span> <p>Praesent sit amet cursus urna. In nec lobortis tellus. Donec congue, urna non semper interdum, que nisi bibendum tellus, sed tempus tellus neque et leo. Cras laoreet mi sed nulla lobortis, epharetra eros laoreet. <br><br>Maecenas vitae ornare arcu. Phasellus gravida congue turpis, eu bibendum lorem molestie eget. Phasellus tristique sapien non placerat eleifend. Nam quis velit non quam bibendum vestibulum ac et purus.</p> </div> <div class="col-md-6"> <h2>Second Procedure</h2> <span>(In nec lobortis tellus)</span> <ol class="no-color"> <li>Pellentesque ligula lectus, molestie quis magna lobortis, placerat imperdiet elit.</li> <li>Praesent sit amet cursus urna. In nec lobortis tellus.</li> <li>Donec congue, urna non semper interdum, que nisi bibendum tellus.</li> <li>Cras laoreet mi sed nulla lobortis, epharetra eros laoreet.</li> <li>Donec convallis elementum convallis. Duis ac purus sem. Fusce id nunc tellus.</li> </ol> </div> </div> <div class="row"> <div class="col-md-6"> <h2>Third Procedure</h2> <span>(Donec convallis elementum convallis)</span> <ol> <li> <h4>Pellentesque ligula lectus, molestie quis magna lobortis.</h4> <p>Praesent sit amet cursus urna. In nec lobortis tellus. Donec congue, urna non semper interdum, que nisi bibendum tellus, sed tempus tellus neque et leo. </p> </li> <li>

评论收藏

内容反馈