紫色儿童摄影工作室bootstrap模板-整站可爱少儿培训大图.rar资源-CSDN文库

共67个文件

jpg：31个

js：10个

png：9个

版权申诉

155 浏览量 2022-11-11 21:07:23 上传评论收藏 1.35MB RAR 举报

Bootstrap模板是一种基于HTML、CSS和JavaScript的开源框架，主要用于快速构建响应式和移动优先的网站。这个"紫色儿童摄影工作室bootstrap模板"是一个专为儿童摄影工作室设计的网站模板，它结合了紫色调和可爱的元素，旨在吸引家长和孩子们的注意力。在设计上，此模板采用了紫色作为主色调，紫色通常给人带来优雅和梦幻的感觉，非常适合儿童摄影这种需要展示温馨、梦幻氛围的业务。同时，模板还融入了粉色元素，进一步增添了柔和和童趣的氛围，适合儿童和少女摄影主题。 "响应式"是Bootstrap的核心特性之一，意味着该模板能够自动适应不同设备的屏幕大小，无论是手机、平板还是桌面电脑，都能提供良好的浏览体验。在移动设备普及的今天，这尤其重要，确保了用户在任何设备上都能轻松访问和浏览网站内容。 "整站"表示这是一个完整的网站模板，包含了所有必要的页面布局和组件，如首页、关于我们、服务项目、作品展示、联系我们等，用户可以根据自己的需求进行定制和填充内容。这样，儿童摄影工作室可以快速搭建起自己的在线平台，展示摄影作品，介绍服务，甚至接受在线预约。 "大图"是指模板可能包含大量高质量的大尺寸图片，这些图片可以用于展示摄影工作室的精彩瞬间和精美作品，让访客能够直观地感受到摄影的品质和风格。在网页设计中，大图往往能产生强烈的视觉冲击力，提升用户体验。 "少儿培训"标签暗示了这个模板不仅适用于普通的儿童摄影，还适合那些提供儿童摄影服务的同时，也涉及儿童教育或培训项目的机构。例如，可以展示摄影课程、亲子活动等内容，吸引有这方面需求的家长。这个"紫色儿童摄影工作室bootstrap模板"提供了一套完整的、美观且功能丰富的解决方案，帮助儿童摄影工作室迅速构建一个既专业又具有吸引力的在线形象。通过利用Bootstrap的灵活性和响应性，网站能够在各种设备上保持一致的用户体验，而其可爱和温馨的设计风格则有助于吸引目标客户群体——家长和孩子们。

资源推荐

资源详情

资源评论

收起资源包目录

紫色儿童摄影工作室bootstrap模板_粉色儿童摄影工作室 bootstrap 响应式手机紫色整站可爱少儿培训大图.rar （67个子文件）

紫色儿童摄影工作室bootstrap模板_粉色儿童摄影工作室 bootstrap 响应式手机紫色整站可爱少儿培训大图

cpts_396_pf

css

bootstrap.css 138KB

styles.css 19KB

common.css 4KB

chocolat.css 2KB

style.css 31KB

images

img18.jpg 32KB

baner.jpg 206KB

img9.jpg 30KB

img1.jpg 23KB

img14.jpg 56KB

img17.jpg 21KB

img10.jpg 6KB

img2.jpg 12KB

img16.png 285KB

img20.jpg 38KB

f4.jpg 18KB

right.png 3KB

img22.jpg 42KB

f6.jpg 18KB

slid.jpg 21KB

img4.jpg 8KB

img21.jpg 20KB

icons.png 3KB

img13.jpg 5KB

close.png 295B

menu-icon.png 3KB

img19.jpg 37KB

f1.jpg 2KB

img8.jpg 11KB

f3.jpg 17KB

slid1.jpg 18KB

icon1.png 3KB

move-up.png 3KB

img11.jpg 8KB

img7.jpg 10KB

img16.jpg 24KB

left.png 3KB

img12.jpg 5KB

f2.jpg 15KB

img5.jpg 9KB

img3.jpg 26KB

sprite.png 4KB

f5.jpg 16KB

img6.jpg 10KB

img15.jpg 29KB

fonts

glyphicons-halflings-regular.woff 23KB

Roboto-Regular.ttf 159KB

glyphicons-halflings-regular.woff2 18KB

MedulaOne-Regular.ttf 33KB

glyphicons-halflings-regular.ttf 44KB

glyphicons-halflings-regular.eot 20KB

glyphicons-halflings-regular.svg 106KB

index.html 12KB

move-top.js 1KB

easing.js 5KB

scripts.js 134B

jquery-1.11.1.min.js 94KB

jquery.hoverdir.js 5KB

jquery.chocolat.js 10KB

modernizr.custom.97074.js 8KB

responsiveslides.min.js 3KB

bootstrap.js 66KB

jquery.flexisel.js 8KB

portfolio.html 10KB

about.html 13KB

codes.html 31KB

contact.html 9KB

<!DOCTYPE html> <html> <head> <title>Short Codes</title>  <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="keywords" content="Toys Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" /> <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>  <link href="css/bootstrap.css" type="text/css" rel="stylesheet" media="all"> <link href="css/styles.css?v=1.6" rel="stylesheet"> <link href="css/style.css" type="text/css" rel="stylesheet" media="all">  <script src="js/jquery-1.11.1.min.js"></script> <script src="js/scripts.js?v=1.7"></script>   <script type="text/javascript" src="js/move-top.js"></script> <script type="text/javascript" src="js/easing.js"></script> <script type="text/javascript"> jQuery(document).ready(function($) { $(".scroll").click(function(event){ event.preventDefault(); $('html,body').animate({scrollTop:$(this.hash).offset().top},1000); }); }); </script>  </head> <body>  <div class="banner about-bnr"> <div class="navigation"> <div class="container-fluid"> <nav class="pull"> <ul class="nav"> <li><a href="index.html"> Home</a></li> <li><a href="about.html"> About</a></li> <li><a href="#" class="menu">Portfolio<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></a></li> <ul class="nav-sub"> <li><a href="portfolio.html">Portfolio 1</a></li> <li><a href="portfolio.html">Portfolio 2</a></li> <li><a href="portfolio.html">Portfolio 3</a></li> </ul> <script> $( "li a.menu" ).click(function() { $( "ul.nav-sub" ).slideToggle( 300, function() { // Animation complete. }); }); </script> <li><a href="codes.html" class="active"> Codes</a></li> <li><a href="contact.html"> Mail us</a></li> </ul> </nav> </div> </div> <div class="header-top"> <div class="container"> <div class="head-logo"> <h1><a href="index.html">Toys</a></h1> </div> <div class="top-nav"> <div class="hero fa-navicon fa-2x nav_slide_button" id="hero"> <a href="#"><img src="images/menu-icon.png" alt=""></a> </div> </div> <div class="clearfix"> </div> </div> </div> </div>   <div class="codes"> <div class="container"> <h3 class="hdng">Short Codes</h3> <div class="grid_3 grid_4"> <h3 class="hdg">Headings</h3> <div class="bs-example"> <table class="table"> <tbody> <tr> <td><h1 id="h1.-bootstrap-heading">h1. Bootstrap heading<a class="anchorjs-link" href="#h1.-bootstrap-heading"><span class="anchorjs-icon"></span></a></h1></td> <td class="type-info">Semibold 36px</td> </tr> <tr> <td><h2 id="h2.-bootstrap-heading">h2. Bootstrap heading<a class="anchorjs-link" href="#h2.-bootstrap-heading"><span class="anchorjs-icon"></span></a></h2></td> <td class="type-info">Semibold 30px</td> </tr> <tr> <td><h3 id="h3.-bootstrap-heading">h3. Bootstrap heading<a class="anchorjs-link" href="#h3.-bootstrap-heading"><span class="anchorjs-icon"></span></a></h3></td> <td class="type-info">Semibold 24px</td> </tr> <tr> <td><h4 id="h4.-bootstrap-heading">h4. Bootstrap heading<a class="anchorjs-link" href="#h4.-bootstrap-heading"><span class="anchorjs-icon"></span></a></h4></td> <td class="type-info">Semibold 18px</td> </tr> <tr> <td><h5 id="h5.-bootstrap-heading">h5. Bootstrap heading<a class="anchorjs-link" href="#h5.-bootstrap-heading"><span class="anchorjs-icon"></span></a></h5></td> <td class="type-info">Semibold 14px</td> </tr> <tr> <td><h6>h6. Bootstrap heading</h6></td> <td class="type-info">Semibold 12px</td> </tr> </tbody> </table> </div> </div> <div class="grid_3 grid_5"> <h3 class="hdg" >Buttons</h3> <h1> <a href="#"><span class="label label-default">Default</span></a> <a href="#"><span class="label label-primary">Primary</span></a> <a href="#"><span class="label label-success">Success</span></a> <a href="#"><span class="label label-info">Info</span></a> <a href="#"><span class="label label-warning">Warning</span></a> <a href="#"><span class="label label-danger">Danger</span></a> </h1> <h2> <a href="#"><span class="label label-default">Default</span></a> <a href="#"><span class="label label-primary">Primary</span></a> <a href="#"><span class="label label-success">Success</span></a> <a href="#"><span class="label label-info">Info</span></a> <a href="#"><span class="label label-warning">Warning</span></a> <a href="#"><span class="label label-danger">Danger</span></a> </h2> <h3> <a href="#"><span class="label label-default">Default</span></a> <a href="#"><span class="label label-primary">Primary</span></a> <a href="#"><span class="label label-success">Success</span></a> <a href="#"><span class="label label-info">Info</span></a> <a href="#"><span class="label label-warning">Warning</span></a> <a href="#"><span class="label label-danger">Danger</span></a> </h3> <h4> <a href="#"><span class="label label-default">Default</span></a> <a href="#"><span class="label label-primary">Primary</span></a> <a href="#"><span class="label label-success">Success</span></a> <a href="#"><span class="label label-info">Info</span></a> <a href="#"><span class="label label-warning">Warning</span></a> <a href="#"><span class="label label-danger">Danger</span></a> </h4> <h5> <a href="#"><span class="label label-default">Default</span></a> <a href="#"><span class="label label-primary">Primary</span></a> <a href="#"><span class="label label-success">Success</span></a> <a href="#"><span class="label label-info">Info</span></a> <a href="#"><span class="label label-warning">Warning</span></a> <a href="#"><span class="label label-danger">Danger</span></a> </h5> <h6> <a href="#"><span class="label label-default">Default</span></a> <a href="#"><span class="label label-primary">Primary</span></a> <a href="#"><span class="label label-success">Success</span></a> <a href="#"><span class="label label-info">Info</span></a> <a href="#"><span class="label label-warning">Warning</span></a> <a href="#"><span class="label label-danger">Danger</span></a> </h6> </div> <div class="grid_3 grid_5"> <h3 class="hdg" >Progress Bars</h3> <div class="tab-content"> <div class="tab-pane active" id="domprogress"> <div class="progress"> <div class="progress-bar progress-bar-primary" style="width: 20%"></div> </div> <p>Info with <code>progress-bar-info</code> class.</p> <div class="progress"> <div class="progress-bar progress-bar-info" style="width: 60%"></div> </div> <p>Success with <code>progress-bar-success</code> class.</p> <div class="progress"> <div class="progress-bar progress-bar-success" style="width: 30%"></div> </div> <p>Warning with <code>progress-bar

评论收藏

内容反馈

版权申诉