关于Bootstrap，相信大家一定不陌生，它已经成为现在主流产业的一个重要工具，Bootstrap提供了优雅的HTML和CSS规范，它基于jQuery框架开发的，它在jQuery框架的基础上进行了更为个性化和人性化的完善，形成一套自己独有的网站风格，并兼容大部分jQuery插件。今天，我们带来6款Bootstrap实现的几款小应用，希望可以对你们有所帮助！

移动为先的Bootstrap3

在线演示

Bootstrap3已经发布好几周了， 现在该是我们看看Bootstrap有什么新鲜内容的时候了。首先，最重要的一个改变就是支持响应式网站设计，原来的响应式模块已经去掉了。 现在从内核，Bootstrap3就支持响应式设计，不仅仅如此，更深入的在于，整合了Mobile First的设计思想，即移动为先，这个概念最初由Luke wrobleski在他的博客提出。在这篇文章中，我们将分享一些BT3的新内容，希望大家喜欢！

使用Bootstrap3和Ladda UI实现的多种按钮“加载中”效果体验

在线演示1     在线演示2     在线演示3

大家在开发基于web的网站或者web应用中，常常在AJAX调用的过程中需要提示用户并且展示相关的“加载中”效果，类似的UI设计也非常多，比如，当点击一个按钮后，在它的旁边显示一个 “加载中” 文字，或者是添加一个“旋转GIF”动画效果图。

基于bootstrap的纯CSS多级菜单 - BootM

在线演示

BootM是基于bootstrap开发的一款多级菜单实现。其主要特性包括：无JS,基于bootstrap,响应式设计,无层次限制,基于文本的图标。

Bootstrap3和jQuery实现响应式iOS/Android风格滚动到页顶（底）弹跳效果

在线演示

如果大家使用iOS或者android相关移动平台的话，对于页面滑动到最底端后的弹跳效果肯定不会陌生，在这篇教程中，我们将使用最新版的Bootstrap3和jQuery来生成一个类似移动设备app的web页面效果，支持各种设备的响应式展示。

Bootstrap富文本编辑器bootstrap-wysiwyg的使用

在线演示

使用其实很简单的，倒入bootstrap相关CSS，JS，jQuery，还有bootstrap-wysiwyg的JS。

Bootstrap3的一个landing page（着落页模板）

在线演示

非常适合你做产品推广或者app推广，支持响应式，并且可以自行扩展开发！

如果大家喜欢，请留言，我们将每周定期给大家推荐一些不错的Bootstrap3模板！

原文来自：分享六个基于Bootstrap的实用开发教程和模板演示

分享六个基于Bootstrap的实用开发教程和模板演示的更多相关文章

  1. 基于Bootstrap简单实用的tags标签插件

    http://www.htmleaf.com/jQuery/ jQuery之家 自由分享jQuery.html5和css3的插件库 基于Bootstrap简单实用的tags标签插件

  2. Metronic – 超赞！基于 Bootstrap 的响应式后台管理模板

    Metronic 是一套精美的响应式后台管理模板,基于强大的 Twitter Bootstrap 框架实现.Metronic 拥有简洁优雅的 Metro UI 风格界面,6 种颜色可选,76 个模板页 ...

  3. 装饰器的初识,基于bootstrap的前端开发

    1装饰器的初识 概念:不改变函数原来的调用方式,动态地给函数添加功能 开放封闭的原则:1>对添加的新功能是开放的,32>不要在元代码进行修改(封闭) 1.1>函数的定义:对代码块和功 ...

  4. Spring_AOP基于AspectJ的注解开发&JDBC的模板使用&事务管理(学习笔记3）

    一:AOP基于AspectJ的注解开发 1,简单的实例: 1)引入相应的jar包 ​ 2)在配置文件里引入相关约束 <beans xmlns="http://www.springfra ...

  5. 推荐几款基于Bootstrap的响应式后台管理模板

    1.Admin LTE 该模版开源免费. AdminLTE - 是一个完全响应式管理模板.基于Bootstrap3的框架.高度可定制的,易于使用.支持很多的屏幕分辨率适合从小型移动设备到大型台式机. ...

  6. 转：Metronic – 超赞！基于 Bootstrap 的响应式后台管理模板

    http://www.cnblogs.com/lhb25/p/metronic-responsive-admin-dashboard-template.html

  7. Ecshop系统二次开发教程及流程演示

      来源:互联网 作者:佚名 时间:03-01 16:05:31 [大 中 小] Ecshop想必大家不会觉得陌生吧,大部分的B2C独立网店系统都用的是Ecshop系统,很受用户的喜爱,但是由于Ecs ...

  8. 2017年最新基于Bootstrap 4 的专业、多用途响应式布局的系统模板

    本文分享一款2017年最新的2017年最新基于Bootstrap 4 的专业.多用途响应式布局的系统模板,该模板是一款强大并且非常灵活的后台管理系统模板:能适应绝大多数的web应用程序开发,比如:AP ...

  9. Netty4.x中文教程系列(六) 从头开始Bootstrap

    Netty4.x中文教程系列(六) 从头开始Bootstrap 其实自从中文教程系列(五)一直不知道自己到底想些什么.加上忙着工作上出现了一些问题.本来想就这么放弃维护了.没想到有朋友和我说百度搜索推 ...

随机推荐

  1. /.nav-tabs :是普通标签页 .nav-pills:胶囊式标签页 action ;默认的激活项，给<li>加默认显示的是哪个标签页内容 .nav是标签页的一个基类，给ul加 .nav-stacked: 垂直排列BootStrap

    <meta name="viewport" content="with=device-width, initial-scale=1, user-scalabe=no ...

  2. HTML中的ul, ol,li , dl,dt, dd标签

    ul: unordered lists ol: ordered lists li: Lists ol 有序列表. <ol><li>……</li><li> ...

  3. JSTL-2

    流程控制标签:if标签, choose标签, when标签, otherwise标签 <c:if>:的两种语法 1.<c:if test=""   var=&qu ...

  4. 扩展swap分区

    swap分区在系统的物理内存不够用时,把硬盘的一部分空间释放出来,以供当前运行的程序使用.(临时使用,如果swap分区都不够了还是直接加内存吧) (1).步骤 mkswap /devices(可以是分 ...

  5. 51nod1624 取余最长路 前缀和 + set

    由于只有3行,因此只会会换行2次,假设$x, y$分别为这两次的换行点 那么答案为$S[1][x] +S[2][y] - S[2][x - 1] + S[3][n] - S[3][y - 1]$ 其中 ...

  6. CodeForces - 1017D The Wu

    题面在这里! 比较显而易见的暴力,O(2^(2n) + 2^n * 100) 就可以直接做了 #include<bits/stdc++.h> #define ll long long us ...

  7. Educational Codeforces Round 12 C. Simple Strings 贪心

    C. Simple Strings 题目连接: http://www.codeforces.com/contest/665/problem/C Description zscoder loves si ...

  8. React Native中树 TreeView 实现（2）

    接上文,剩下的展示工作是重中之重,首先确定节点的布局草稿——也就是如何render item: 在此之前还有一个重要的问题就是选择何种组件盛放展示子结点,一般有如下两种: 使用scrollview加载 ...

  9. 微信小程序的坑

    虽然官方文档,可以在.json中给页面设置背景颜色,用backgroundColor,但是实际上并不好使,所以设置背景颜色只能在wxss中设置 <import src="../comm ...

  10. h264 封装 RTMP中FLV数据的解析 rtmp协议简单解析以及用其发送h264的flv文件

    一个完整的多媒体文件是由音频和视频2部分组成的.H264.Xvid等就是视频编码格式,MP3.AAC等就是音频编码格式.字幕文件只是其中附带部分. 把视频编码和音频编码打包成一个完整的多媒体文件,可以 ...