文档章节

web前端框架

quanpower
 quanpower
发布于 2013/03/11 23:26
字数 1256
阅读 397
收藏 8

The Best BootStrap Resources

Twitter BootStrap是一款优秀的前端的框架,称得上是前端的一个框架利器。Web前端开发者每天都在与HTML、CSS、JavaScript打交道,然而不少人都是在周而复始的写模板、样式和交互效果,前没有想过如何将这些重复的工作整合在一起。Twitter推出的BootStrap能够帮助Web前端开发者摆脱这种重复的劳动。

最近在各群讨论BootStrap相关的话题也明显增多,有很多Web前端人员在开始或者已接触、并在使用BootStrap。为了能帮助大家更好的学习和使用Bootstrap这 个优秀框架,我今天整理了一份我收藏的相关资源,这篇文章可以说是学习BootStrap的一个最好最全的资源,其中包含了八个BootStrap代码生 成器、九个BootStrap工具、四个优秀的BootStrap主题、十一个BootStrap自带的JavaScript库和11篇优秀的 BootStrap教程。希望这些资源大家会喜欢。

BootStrap主题生成器

1、Bootstrap Custom Build

Bootstrap Custom Build

Bootstrap提供了自定义模块组,你可以在Bootstrap官网中自定义需要的组件(无需将整个bootstrap下载下来),这样可以减去你不需要的bootstrap组件代码。同时可以根据自己的设计需求,自定义bootstrap中的变量参数,比如说色系、Grids系统等。

2、StyleBootstrap.info

StyleBootstrap.info

与Bootstrap自带自定义组件工具相比,这个工具更简单,通过界面化的操作,可以让你自己定义一套适合自己设计需求的主题功能,比如说 “Navbar”、“body”、“typography”、“button”、“forms”、“miscellaneous”等。

3、Beautiful Buttons for Twitter Bootstrappers

Beautiful Buttons for Twitter Bootstrappers

这是一个简单的小工具,只做一件事:帮助您设计漂亮的按钮使用Twitter的引导。它不会彻底改变你的使用引导方式,但它是很有趣的。

4、Bootstrap Generator

Bootstrap Generator

基于Bootstrap主题的引导,通过这个简单的工具,定制你自己需要的设计风格,并且可以轻松的导出你需要的CSS代码。

5、BootTheme

BootTheme

BootTheme是一款强大的在线制作Bootstrap主题的工具,可以自己Bootstrap中的各类参数,而且还能实时的观测你设置参数和变量对主题的影响和效果,最后还可以直接下载你定制好的Bootstrap主题代码。

6、Twitter Bootstrap Button Generator

Twitter Bootstrap Button Generator

这是一款小工具,主要功能是用来定制Bootstrap的Buttons效果,如果你需要使用Bootstrap的Button效果,这个工具能给你带来很大的方便。简单易用。

7、BootSwatch

BootSwatch

BootSwatch是一款可视化在线编辑BootStrap主题的工具。

8、Bootstrap ThemeRoller

Bootstrap ThemeRoller

一个方便和直观的应用程序,他提供了一个直观的界面,用来帮助你定制你最喜欢的Bootstrap主题设计效果。

Bootstrap工具

1、jQuery UI Bootstrap

jQuery UI Bootstrap

收集了一些美丽的BootStrap UI插件

2、Font Awesome

Font Awesome

BootStrap的ICON库

3、Bootboxjs

Bootboxjs

Bootboxjs是一个简单的js库,简单快捷帮你制作一个Bootstrap的弹出框效果。

4、Colorpicker and Datepicker

Colorpicker and Datepicker

Pretty straight forward, it’s a colorpicker and datepicker that matches the bootstrap style.

5、jQuery Mobile Boostrap

jQuery Mobile Boostrap

一个基于BootStrap的jQuery Mobile主题。

6、Sass Twitter Bootstrap

Sass Twitter Bootstrap

Bootstrap一个强大的CSS预处理器。

7、Bootstrap PSD

Bootstrap PSD

Bootstrap一些UI效果扩展,你完全可以根据设计图配合一定的生成器。定制你需要的Bootstrap。

8、Bootstrap Fireworks

Bootstrap Fireworks

使用在Fireworks制作工作是的一个bootstrap扩展插件。

9、jQuery Bootstrap

jQuery Bootstrap

jQuery Bootstrap不仅仅是另一个CSS框架,他还可以让你改变你的样式。

BootStrap主题

1、DarkStrap

DarkStrap

一个黑色系的BootStrap主题

2、FB Boostrap

FB Boostrap

一个Facebook色系的BootStrap主题

3、Kickstrap

Kickstrap

完整版的BootStrap主题,而且在其基础上进行过扩展,还有其他更大的优势。

4、BootMetro

BootMetro

BootStrap与Metro UI结合的一个主题。

BootStrap JavaScript Library

1、Modals bootstrap-modal.js

Modals bootstrap-modal.js

BootStrap制作弹出框的插件库。

2、Dropdowns bootstrap-dropdown.js

Dropdowns bootstrap-dropdown.js

BootStrap制作下拉菜单的库。

3、ScrollSpy bootstrap-scrollspy.js

ScrollSpy bootstrap-scrollspy.js

BootStrap制作滚动条位置配合菜单项的插件库。

4、Togglable tabs bootstrap-tab.js

Togglable tabs bootstrap-tab.js

BootStrap制作tabs菜单的库。

5、Tooltips bootstrap-tooltip.js

Tooltips bootstrap-tooltip.js

BootStrap制作tip提示框的插件库。

6、Popovers bootstrap-popover.js

Popovers bootstrap-popover.js

BootStrap制作Popovers提示框的插件库。

7、Alert messages bootstrap-alert.js

Alert messages bootstrap-alert.js

BootStrap制作信息栏的插件库。

8、Buttons bootstrap-button.js

Buttons bootstrap-button.js

BootStrap制作按钮的插件库。

9、Collapse bootstrap-collapse.js

Collapse bootstrap-collapse.js

BootStrap制作手风琴的插件库。

10、Carousel bootstrap-carousel.js

Carousel bootstrap-carousel.js

BootStrap制作slidershow的插件库。

11、Typeahead bootstrap-typeahead.js

Typeahead bootstrap-typeahead.js

BootStrap制作文本自动补全的插件库。

BootStrap Tutorials

1、CSS——Bootstrap From Twitter

CSS——Bootstrap From Twitter

2、Twitter Bootstrap:前端框架利器

Twitter Bootstrap:前端框架利器

3、Building Twitter Bootstrap

Building Twitter Bootstrap

4、Twitter Bootstrap 101: Introduction

Twitter Bootstrap 101: Introduction

5、Sample App with Backbone.js and Twitter Bootstrap

Sample App with Backbone.js and Twitter Bootstrap

6、Twitter Bootstrap tutorial

Twitter Bootstrap tutorial

7、Adding Twitter’s Bootstrap CSS to your Rails app

Adding Twitter's Bootstrap CSS to your Rails app

8、5 Incredibly Useful Tools Built Into Twitter Bootstrap

Adding5 Incredibly Useful Tools Built Into Twitter Bootstrap

9、Twitter Bootstrap 2: Bootstrap Goes Responsive

Twitter Bootstrap 2: Bootstrap Goes Responsive

10、Bootstrap Your Application Using Twitter Bootstrap

Bootstrap Your Application Using Twitter Bootstrap

11、Bootstrap Tutorial for Blog Design.

Bootstrap Tutorial for Blog Design.

特别声明:上述资源如有碰到打不开站点,请开启您的VPN设置,因为大多数资源都是外文,有可能会在国内打不开。

© 著作权归作者所有

上一篇: python Flask 安装
quanpower
粉丝 65
博文 166
码字总数 104911
作品 0
嘉定
CTO(技术副总裁)
私信 提问
2015年最全的移动WEB前端UI框架

目前,众多互联网公司APP都嵌入了大量的HTML5,移动端的开发越来越重视,HTML5的运用场景也越来越多了。下面在移动WEB开发的过程中,使用合适的移动WEB UI框架可以大大提升我们的开发效率。下...

mdoo
2016/09/13
243
0
聊聊未来的前端时代

  2016年结束了,前端技术的发展也将进入到一个新的阶段,那么未来又会给我们带来什么呢?这里就个人发表下意见,不喜勿喷。   就前端主流技术框架的发展而言,过去的几年里发展极快,在...

ouven
2016/12/14
1K
1
JavaScript 年度调查报告:React、Vue 和 Angular 三分天下,谁将在 201

JavaScript 年度调查报告:React、Vue 和 Angular 三分天下,谁将在 201 程序师2017-12-290 阅读 javascript业界观察 要论 2017年最主流的三个 Web前端框架,应莫过于 Angular、Vue和 React了...

程序师
2017/12/29
0
0
精读《现代 js 框架存在的根本原因》

1 引言 深入思考为何前端需要框架,以及 web components 是否可以代替前端框架? 原文地址,建议先阅读原文,或者阅读概述。 2 概述 现在前端框架非常多了,如果让我们回答 “为什么要用前端...

黄子毅
2018/05/21
0
0
精读《现代 js 框架存在的根本原因

1 引言 深入思考为何前端需要框架,以及 web components 是否可以代替前端框架? 原文地址,建议先阅读原文,或者阅读概述。 2 概述 现在前端框架非常多了,如果让我们回答 “为什么要用前端...

黄子毅
2018/05/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Less导入选项

Less 提供了CSS @import CSS规则的几个扩展,以提供更多的灵活性来处理外部文件。 语法: @import (keyword) "filename"; 以下是导入指令的相关详情: reference,使用较少的文件但不输出。 ...

凌兮洛
5分钟前
3
0
Docker下实现MySQL主从(读、写分离)同步配置

docker下实现两个(或多个)mysql容器的主、从数据库同步配置,首先要明白docker容器的相互通信关系,默认是使用的bridge模式: 也就是说,通过docker run命令创建docker容器是每个容器都有自己...

源哥L
15分钟前
8
0
一起来学Java8(三)——方法引用

在一起来学Java8(一)——函数式编程中有一个简单的函数式编程的例子: import java.util.function.Consumer;class Person { public static void sayHello(String name) { S...

猿敲月下码
34分钟前
15
0
读书笔记:深入理解ES6(十一)

第十一章 Promise与异步编程   Promise可以实现其他语言中类似Future和Deferred一样的功能,是另一种异步编程的选择,它既可以像事件和回调函数一样指定稍后执行的代码,也可以明确指示代码...

张森ZS
58分钟前
23
0
面试官,Java8 JVM内存结构变了,永久代到元空间

在文章《JVM之内存结构详解》中我们描述了Java7以前的JVM内存结构,但在Java8和以后版本中JVM的内存结构慢慢发生了变化。作为面试官如果你还不知道,那么面试过程中是不是有些露怯?作为面试...

程序新视界
今天
30
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部