大图幻灯精致产品报价单页html模板下载-灰色大图幻灯精致产品报价报价单css3html.rar资源-CSDN文库

共38个文件

png：17个

jpg：12个

css：4个

版权申诉

173 浏览量 2022-11-20 10:09:10 上传评论收藏 1.32MB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

大图幻灯精致产品报价单页html模板下载_灰色大图幻灯精致产品报价报价单 css3 html.rar （38个子文件）

大图幻灯精致产品报价单页html模板下载_灰色大图幻灯精致产品报价报价单 css3 html

ftmp_193_nr

style

nivo-slider.css 1KB

reset.css 837B

site.css 13KB

default

bullets.png 1KB

default.css 1KB

arrows.png 824B

loading.gif 2KB

images

line-top-screens.png 1KB

efficient.png 1KB

next.png 2KB

easy.png 2KB

time.png 7KB

line-h.png 446B

2.jpg 187KB

1.jpg 92KB

6.jpg 56KB

prev.png 2KB

3.jpg 201KB

5.jpg 333KB

screenshot1.jpg 46KB

design.png 2KB

twitter.png 5KB

facebook.png 5KB

screenshot3.jpg 25KB

in.png 5KB

4.jpg 144KB

dvsup.png 3KB

logo.jpg 4KB

quality.png 2KB

support.png 3KB

screenshot2.jpg 23KB

bg-noise.jpg 3KB

7.jpg 127KB

skype.png 6KB

index.html 14KB

jquery.js 84KB

carouFredSel-5.5.0.js 75KB

jquery.nivo.slider.pack.js 15KB

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link href="style/reset.css" media="screen" rel="stylesheet" type="text/css"> <link href="style/site.css" media="screen" rel="stylesheet" type="text/css"> <link href="style/nivo-slider.css" media="screen" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="style/default/default.css" type="text/css" media="screen" /> <script src="js/jquery.js" type="text/javascript"></script> <script src="js/carouFredSel-5.5.0.js" type="text/javascript"></script> <script type="text/javascript" src="js/jquery.nivo.slider.pack.js"></script> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider({ effect: 'random', // Specify sets like: 'fold,fade,sliceDown' controlNav: false, // 1,2,3... navigation captionOpacity: 0.3 // Universal caption opacity }); // Scrolled by user interaction $('.thumb-slider').carouFredSel({ prev: '#prev2', next: '#next2', auto: false }); }); $(document).ready(function(){ // Change the image of hoverable images $(".imgHoverable").hover( function() { var hoverImg = HoverImgOf($(this).attr("src")); $(this).attr("src", hoverImg); }, function() { var normalImg = NormalImgOf($(this).attr("src")); $(this).attr("src", normalImg); } ); }); function HoverImgOf(filename) { var re = new RegExp("(.+)\\.(gif|png|jpg)", "g"); return filename.replace(re, "$1_hover.$2"); } function NormalImgOf(filename) { var re = new RegExp("(.+)_hover\\.(gif|png|jpg)", "g"); return filename.replace(re, "$1.$2"); } </script> <title>StepOne | Landing Page</title> </head> <body>  <div id="body-wrapper"> <div id="header"> <div class="mCont"> <h1><a href="#">StepOne</a></h1> <p class="headtag">Professional Landing Page for Startups!</p> </div> </div>  <div id="intro" class="interactive"> <div class="mCont"> <div class="tagline"> <h2>This is an awesome punch line</h2> <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</h3> </div>  <div id="banner"> <div class="slider-wrapper theme-default"> <div class="ribbon"></div> <div id="slider" class="nivoSlider"> <img src="images/1.jpg" alt="" title="We Are Creative TV heads" /> <img src="images/2.jpg" alt="" title="I Am a Typographic Image" /> <img src="images/3.jpg" alt="" title="Grids Are Good" /> <img src="images/4.jpg" alt="" title="Designers Love Typography" /> <img src="images/5.jpg" alt="" title="I Love Helvetica" /> <img src="images/6.jpg" alt="" title="Music Village" /> <img src="images/7.jpg" alt="" title="Typographic World Map" /> </div> </div> </div>   <div id="actions-bar"> <h3><span class="buttonCont"><a class="button btn1" title="Sign Up" href="#"><span>Let's Get Started</span></a></span> <span class="or">or</span> <a class="tour" title="Take a Tour" href="#">Find Out More</a></h3> </div>  </div> </div> <div id="main-content"> <div class="mCont"> <div class="section PTB40 MT5">  <div id="features"> <ul> <li class="donefffeciently"> <h3>Done Effeciently</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <span class="featureIcon"></span> </li> <li class="beautifuldesign"> <h3>Beautiful Design</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <span class="featureIcon"></span> </li> <li class="supereasy odd"> <h3>Super Easy to Use</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <span class="featureIcon"></span> </li> <li class="qualitycode MT40"> <h3>Quality Code</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <span class="featureIcon"></span> </li> <li class="saveyourtime MT40"> <h3>Save Your Time</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <span class="featureIcon"></span> </li> <li class="support MT40 odd"> <h3>24x7 Support</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <span class="featureIcon"></span> </li> </ul> </div>  </div>  <div id="screens" class="section PTB40"> <ul class="featureCont"> <li> <h3>What is it?</h3> <a class="featureImage"><img alt="" height="120" src="images/screenshot1.jpg" width="290"></a> <p class="PB40">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </li> <li> <h3>Who is it for?</h3> <a class="featureImage"><img alt="" height="120" src="images/screenshot2.jpg" width="290"></a> <p class="PB40">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </li> <li> <h3>Why use it?</h3> <a class="featureImage"><img alt="" height="120" src="images/screenshot3.jpg" width="290"></a> <p class="PB40">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </li> </ul> </div>  <div class="section PB40"> <div id="signup"> <h3 class="getstarted">Get started in 30 seconds.</h3> <div class="signup-button"><a href="javascript:">Purchase StepOne Now</a></div> </div> </div> <div class="copyrights">Collect from <a href="http://www.moobnn.com/" >模板在线</a> <a href="http://guantaow.taobao.com" target="_blank">厚朴网络淘宝店</a></div>  <div class="section slider-wrapper"> <div class="arrow-left"><a href="#" id="prev2"> <div class="arrow-left-sprite"></div> </a></div> <div class="arrow-right"><a href="#" id="next2"> <div class="arrow-right-sprite"></div> </a></div> <ul class="featureCont thumb-slider"> <li> <h3>Built for Performance</h3> <p>Lorem ipsum dolor sit amet, <a href="#">consectetur adipisicing elit</a>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> </li> <li> <h3>Optimized for SEO</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit

评论收藏

内容反馈

版权申诉