[Bootstrap](http://hovertree.com/menu/bootstrap/) 是由两个 twitter 员工开发并开源的前端框架,非常火爆,而如此火爆自然有它的道理,在我们团队的所有项目中正全面推行使用 Bootstrap,我想根据自己的实际使用体验来说明一下为什么要用 Bootsrap。

首先,Bootstrap 出自 twitter,大厂出品,并且开源,自然久经考验,减少了测试的工作量。站在巨人的肩膀上,不重复造轮子。 
   
  同时,Bootstrap 的代码有着非常良好的代码规范,从中也可以学习到很多,在 Bootstrap 的基础之上创建项目,日后代码的维护也变得异常简单清晰。

Bootstrap 的一大优势就是它是基于 Less 打造的,并且也有 [Sass版本]。正因为如此,它一推出就包含了一个非常实用的 Mixin 库任你调用。 
   
  举个很简单的例子,当你平时要用到一些 css3 属性的时候,你要写不同的浏览器写不同的 -prefix-,比如圆角 border-radius : 
  

-webkit-border-radius: 10px;
   -moz-border-radius:10px;
   -border-radius:10px;
/* 何问起 hovertree.com */

  

  但是通过 Bootstrap 给你预设好的 mixin,你直接写成这样就可以了: 
   
   @include border-radius (10px); 
   
  是不是轻松愉快?基本常用的 CSS3 mixin 都帮你整理好了,你都直接调用就可以了,在此不一一举例。 Bootstrap 是目前最好的基于 Less(Sass) 的前端框架,丰富而实用的 Mixin 应该是其最好的地方。 Bootstrap 已经帮你搭好了实现 Responsive Design 的基础框架,并且非常容易修改。如果你是一个新手,Bootstrap 可以帮助你在非常短的时间内上手 Responsive Design。另外、由于 Bootstrap 的火爆,又出现了不少围绕 Bootstrap 而开发的插件。其中最实用的莫过于 [Font Awesome](http://fortawesome.github.com/Font-Awesome/) 了。它是一套 icon font,提供了丰富的 icon 给你选择,新的 2.0 版又根据网友的意见增加了70个新的 icon。

Bootstrap 的组件 非常丰富,并且代码简洁,非常易于修改,你完全可以在其基础之上修改成自己想要的任何样子。这是工作效率的极大提升。在现在一股有 Apple 带领的 Retina 潮流下,对图片的视网膜屏下的解决方案已经变得越来越有必要了,而在 icon 这个东西上,icon font 是完美的解决方案,不用担心分辨率的问题,因为它实际上是字体。

这些就是为什么要用 Bootstrap的原因,目前市面上没有任何其他框架可以和它相媲美,但是它就虽然是一匹好马,你还是需要花费一些时间去学习它、适应它,它在日后给你带来的便利性是无可比拟的,你会后悔自己为什么没有早点接触它。

特效:http://www.cnblogs.com/roucheng/p/texiao.html

为什么要用 Bootstrap的更多相关文章

  1. 旺财速啃H5框架之Bootstrap(五)

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

  2. 旺财速啃H5框架之Bootstrap(四)

    上一篇<<旺财速啃H5框架之Bootstrap(三)>>已经把导航做了,接下来搭建内容框架.... 对于不规整的网页,要做成自适应就有点玩大了.... 例如下面这种版式的页面. ...

  3. bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

    也许单页程序(Single Page Application)并不是什么时髦的玩意,像Gmail在很早之前就已经在使用这种模式.通常的说法是它通过避免页面刷新大大提高了网站的响应性,像操作桌面应用程序 ...

  4. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  5. Bootstrap 模态框(Modal)插件

    页面效果: html+js: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. 利用bootstrap的carousel.js实现轮播图动画

    前期准备: 1.jquery.js. 2.bootstrap的carousel.js. 3.bootstrap.css. 如果大家不知道在哪下载,可以联系小颖,小颖把这些js和css可以发送给你. 一 ...

  7. 旺财速啃H5框架之Bootstrap(三)

    好多天没有写了,继续走起 在上一篇<<旺财速啃H5框架之Bootstrap(二)>>中已经把CSS引入到页面中,接下来开始写页面. 首先有些问题要先处理了,问什么你要学boot ...

  8. 旺财速啃H5框架之Bootstrap(二)

    突然感觉不知道写啥子,脑子里面没水了,可能是因为今晚要出去浪,哈哈~~~提前提醒大家平安夜要回家哦,圣诞节生00000000000这么多蛋....继续 上一篇的已经把bootstrap了解个大概了,接 ...

  9. 旺财速啃H5框架之Bootstrap(一)

    接下来的时间里,我将和大家一起对当前非常流行的前端框架Bootstrap进行速度的学习,以案例的形式.对刚开始想学习Bootstrap的同学而找不着边的就很有帮助了.如果你想详细的学习Bootstra ...

  10. [BootStrap] 富编辑器,基于wysihtml5

    在我的周围,已经有很多人在使用BootStrap,但对于任何一个带留言.评论.提问.文章编辑功的网站,编辑器永远是重中之重,显然,早期的编辑器完全没考虑过BootStrap的出现,或皮肤跟网站不匹配, ...

随机推荐

  1. 自制Unity小游戏TankHero-2D(1)制作主角坦克

    自制Unity小游戏TankHero-2D(1)制作主角坦克 我在做这样一个坦克游戏,是仿照(http://game.kid.qq.com/a/20140221/028931.htm)这个游戏制作的. ...

  2. 对Google cloud platform 做了点研究

    Google也推出了云计算基础服务, 加上微软Azure,亚马逊AWS, 都齐活了. 下面是研究了一下对其的一个初步了解. 计算: Compute Engine     IaaS平台,提供VM,操作灵 ...

  3. Oracle数据库面试题【转载】

    1. Oracle跟SQL Server 2005的区别? 宏观上: 1). 最大的区别在于平台,oracle可以运行在不同的平台上,sql server只能运行在windows平台上,由于windo ...

  4. 项目管理师prince2

    项目管理师prince2 PRINCE2并不适合用于管理商业活动中的日常事物.商业日常事务通常是指组织机构日常运营中需要完成的那些工作.例如,公司it系统的维护,宾馆的房间整理,或者运营公司的客户呼叫 ...

  5. C#并行编程-PLINQ:声明式数据并行

    目录 C#并行编程-相关概念 C#并行编程-Parallel C#并行编程-Task C#并行编程-并发集合 C#并行编程-线程同步原语 C#并行编程-PLINQ:声明式数据并行 背景 通过LINQ可 ...

  6. HTML5 的 localStorage(本地数据库) 的用法

    判断浏览器是否支持localStorage可以使用下面的代码:if(window.localStorage){     alert("支持localStorage") }else{ ...

  7. javascript原型对象prototype

    “我们创建的每一个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法.” 引用类型才具有prototype属性 ...

  8. 每天一个linux命令(15):tail 命令

    tail 命令从指定点开始将文件写到标准输出.使用tail命令的-f选项可以方便的查阅正在改变的日志文件,tail -f filename会把filename里最尾部的内容显示在屏幕上,并且不但刷新, ...

  9. 手把手教你实现一个完整的 Promise

    用过 Promise,但是总是有点似懂非懂的感觉,也看过很多文章,还是搞不懂 Promise的 实现原理,后面自己边看文章,边调试代码,终于慢慢的有感觉了,下面就按自己的理解来实现一个 Promise ...

  10. C# yeild使用

    C# yeild的两种形式的yield语句: yield return <expression>; yield break; 使用 yield return 语句每一次返回每个元素. 将使 ...