关于Bootstrap,相信大家一定不陌生,它已经成为现在主流产业的一个重要工具,Bootstrap提供了优雅的HTMLCSS规范,它基于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相关移动平台的话,对于页面滑动到最底端后的弹跳效果肯定不会陌生,在这篇教程中,我们将使用最新版的Bootstrap3jQuery来生成一个类似移动设备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. 【UOJ #105】【APIO2014】Beads and wires

    http://uoj.ac/problem/105 好神的dp啊. 确定一个点为根之后,蓝线只能是竖着的,不能横跨兄弟. 枚举每个点为根进行树形dp是\(O(n^2)\)的,\(f(x,0/1)\)表 ...

  2. BZOJ4554 HEOI2016游戏

    网络流. 我一开始傻傻的将每条边与每一列连边,边权为联通块树,但是这样做是错的因为我们就在跑网络流中会忽略掉边和列的关系. 我们在做网络流题时一定要注意题目中给出的限制条件,一定要以限制条件建图!!! ...

  3. 「TJOI 2018」游园会 Party

    「TJOI 2018」游园会 Party 题目描述 小豆参加了 \(NOI\) 的游园会,会场上每完成一个项目就会获得一个奖章,奖章只会是 \(N, O, I\) 的字样. 在会场上他收集到了 \(K ...

  4. 【期望DP】BZOJ4008- [HNOI2015]亚瑟王

    题目大意 有\(n\)张卡牌,\(r\)轮游戏.每张卡牌只能用至多一次,每张卡牌被用到的概率为\(p_i\).现在从左往右轮,直到最右一张卡片或者某张卡片被用到.如果某张卡牌被用到,产生\(d_i\) ...

  5. Varnish与Squid的对比

    Varnish与Squid的对比 说到Varnish,就不能不提Squid.Squid是一个高性能的代理缓存服务器,它和Varnish相比较有诸多的异同点,下面进行分析. 下面是Varnish与Squ ...

  6. bzoj 3389: [Usaco2004 Dec]Cleaning Shifts安排值班 -- 贪心

    3389: [Usaco2004 Dec]Cleaning Shifts安排值班 Time Limit: 1 Sec  Memory Limit: 128 MB Description     一天有 ...

  7. oracle linux 7.3 dtrace 安装

    [root@localhost dtrace]# uname -r -.el7uek.x86_64 [root@localhost dtrace]# cat /etc/oracle-release O ...

  8. Java:准备学习的高级主题

    ClassLoader GC Concurrent Transaction JTA JPA JDBC JNDI JNI JNA JNative OSGI JMS JSTL EL Servlet NIO ...

  9. OAuth:第一天学习OAuth

    收集的一些资料 http://baike.baidu.com/view/3948029.htm. http://oauth.net/. 使用百度的OAuth服务进行测试 代码下载:http://yun ...

  10. 对java3d的位置理解

    以一个圆柱体为例: 圆柱体的一个特征点假设为(0,0,0),如下图示: 当特征点变为(0,0.4f,0)时,我们看到的圆柱体就如下所示: 当特征点变为(0,0.8f,0)时,我们看到的圆柱体就如下所示 ...