资讯频道 → Web前端
阅读更多

8顶
1踩

Web前端

原创新闻 6 个基于Bootstrap的实用开发教程和演示

2014-03-31 11:00 by 见习编辑 tyygming 评论(0) 有10783人浏览
Bootstrap jquery css 教程

声明：ITeye资讯文章的版权属于ITeye网站所有，严禁任何网站转载本文，否则必将追究法律责任！

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

1.  移动为先的Bootstrap3

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



在线演示

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

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



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

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

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



在线演示

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

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



在线演示

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

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



在线演示

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

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



在线演示

原文来自：分享六个基于Bootstrap的实用开发教程和模板演示
  • 大小: 30.1 KB
  • 大小: 41.9 KB
  • 大小: 14.3 KB
  • 大小: 45.8 KB
  • 大小: 23.5 KB
  • 大小: 38.9 KB
来自: www.gbtags.com
8
顶
1
踩
评论 共 0 条 请登录后发表评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Global site tag (gtag.js) - Google Analytics