向Twitter Bootstrap 学习什么?

标签: 互联网产品 Bootstrap CSS Twitter 前端开发 | 发表时间:2011-08-20 16:27 | 作者:成远 junyu
出处:http://blog.zhihu.com
故事得从头讲起。
Twitter 有一位风格清新的设计师 Mark Otto(此人之前在 Zurb)[1],他负责了很多 Twitter 非前台的页面设计,比如 Dev、Support 和 Promoted Products 的设计。
去年,Mark 在自己网站发布了一套基于 Less [2] 框架的工具合集(mixins)—— Bootstrap.less [3],方便前端开发(静态部分)。秉承他在 Twitter 的一贯设计风格,同时考虑到国外用户的大环境,使用了大量超出现有普及水平的 CSS 样式,倒也算是一套称手的工具。
可能是 Twitter 的内部环境实在宽松,对员工的信赖程度和对新技术的坚定支持也超过了绝大多数国内公司,他们不仅把被某些人诟病有性能问题的 Less 直接用于生产环境(当然是编译后的代码),同时 Mark 也把自己的设计风格继承到了 Twitter Bootstrap 里。于是有了这套工具集。

Bootstrap 到底是坨什么东西?
如果你用过之前的 H5BP [4] 或者 960 Grid System [5] 之类的前端框架,那就很容易理解,Bootstrap 就是一堆现成 CSS 样式的合集。

Bootstrap 有什么“过人之处”?
在我这样的崇尚简洁淡雅的设计师看来,Bootstrap 内置样式非常漂亮,而且够用。与其把网站搞得花里胡哨,不如一切从简。Bootstrap 在 reset 浏览器样式之余,又添加了类 Twitter 的页面元素,你要做的只是用,肆无忌惮地、放心地用,不用琢磨这个行高、计算那个宽度、让不小心忘记定义的页面元素尴尬地显示在页面上。而且它出自 Twitter 之手,经受了亿万用户的考验,外加 Twitter 强大的设计团队的支持,让这套框架显得与众不同。

Bootstrap 于我们,意义何在?
方便没有设计师的团队也能迅速拿出一个看得过眼去的网站原型,不要考虑太浮夸的设计,一切从极简出发。
当然,Twitter Bootstrap 完全没有考虑非英文页面的元素展现,是否适合用来做中文网站,还有待检验。我开心的是,Twitter 这样的公司,在输出产品、输出技术、输出理念之外,又开始输出设计。我的忧虑也同样如此。

[1] Mark Otto 的 Twitter 账号 http://twitter.com/mdo 及博客 http://markdotto.com/
[2] LESS http://lesscss.org/ 以及类似的动态 CSS 框架 Sass http://sass-lang.com/
[3] Bootstrap.less http://markdotto.com/bootstrap/
[4] HTML5 ★ Boilerplate http://html5boilerplate.com/
[5] 960 Grid System http://960.gs/

相关 [twitter bootstrap 学习] 推荐:

向Twitter Bootstrap 学习什么?

- junyu - 知乎的博客
什么是 Twitter Bootstrap. Twitter 有一位风格清新的设计师 Mark Otto(此人之前在 Zurb)[1],他负责了很多 Twitter 非前台的页面设计,比如 Dev、Support 和 Promoted Products 的设计. 去年,Mark 在自己网站发布了一套基于 Less [2] 框架的工具合集(mixins)—— Bootstrap.less [3],方便前端开发(静态部分).

【外刊IT评论网】Twitter Bootstrap

- - 外刊IT评论网
Bootstrap是一个基于HTML,CSS,JAVASCRIPT的简洁灵活的. 它目前是GitHub 上最火的一个项目. 美国国家航空航天局和美国MSNBC有线新闻频道都使用了它. 本文的作者是Bootstrap的创始人之一. 我并不认为从开发Bootstrap框架中学到了任何东西. 事实上,我非常确信,我不会学到任何东西.

Twitter Bootstrap生态系统持续增长

- - InfoQ cn
Bootstrap Hero最近针对 Twitter Bootstrap发布了 一个超过200多个资源的列表. 文章列出了各种UI部件,从 accordions到 address pickers再到 pagination tools和一些 更强大的模型窗口. 当然,它同时也列出了很多其他的资源,展示了整个生态系统目前的丰富程度.

轻量级前端开发工具Bootstrap重大改进,Twitter发布Bootstrap 2.0

- - 36氪
Twitter今日在 开发者博客上公布消息, 6个月前发布的轻量级前端开发工具Bootstrap迎来重大改进,正式升级为Bootstrap 2.0( 下载源码). 和原来一样,Bootstrap 2.0仍然是一个托管在GitHub上的开源项目. 去年8月,Twitter推出了用于快速搭建网页应用的轻量级前端开发工具Bootstrap,由Twitter的设计师 Mark Otto和 Jacob Thornton合作完成.

Twitter推出轻量级前端开发工具Bootstrap

- 可可 - 36氪
Twitter刚刚推出了一套用于快速搭建网页应用的轻量级前端开发工具Bootstrap. Bootstrap工具由Twitter设计师Mark Otto和Jacob Thornton合作开发. 你可以从GitHub上获取这套源码,相关示例请查看这里. Bootstrap是一套用于开发网页应用,符合HTML和CSS简洁但优美规范的库.

Twitter Bootstrap 中文帮助文档/中文手册/中文教程

- - 博客园_梦想天空
   Bootstrap 是基于 HTML,CSS,JavaScript 的简洁灵活的流行前端框架及交互组件集,由微博的先驱 Twitter 在2011年8月开源的整套前端解决解决方案. Bootstrap 有非常完备和详尽的使用帮助文档,热心的 @TV来客开发者 翻译成了中文,讨厌英文的朋友有福了.

向Web开发人员推荐12款优秀的 Twitter Bootstrap 组件和工具

- - 博客园_梦想天空
  Bootstrap 是基于 HTML,CSS 和 JavaScript 的简洁灵活的流行前端框架及交互组件集,由微博的先驱 Twitter 在2011年8月开源的整套前端解决解决方案. Bootstrap 有非常完备和详尽的开发文档,. Web 开发人员能够轻松搭建出清爽风格的界面以及实现良好的交互效果.

Bootstrap: Webアプリケーションのための高度なCSSフロントエンドを手早く作れるツールをTwitterがリリース

- 三十不归 - TechCrunch Japan
Twitterが今日(米国時間8/19)、Bootstrapをリリースした. CSSを使うWebアプリケーションを作るためのツールキットで、CSSの文字指定、フォーム、ボタン、テーブル、グリッド、ナビゲーション、アラートなどなどを使ってアプリケーションのフロントエンドを作る. Bootstrapの入手は、GitHubのここで.

[原]Bootstrap,Bagging,Boosting

- - 狮子座明仔知识集散场
Bootstrap(自助法). Bootstrap,即“自助法”,是用小样本来估计大样本的统计方法. 子样本之于样本,可以类比样本之于总体. 你要统计你们小区里男女比例,可是你全部知道整个小区的人分别是男还是女很麻烦对吧. 于是你搬了个板凳坐在小区门口,花了十五分钟去数,准备了200张小纸条,有一个男的走过去,你就拿出一个小纸条写上“M”,有一个女的过去你就写一个“S”.

Bootstrap,网站模板,bootstrap模板

- - CSDN博客Web前端推荐文章
日期:2013-3-31  来源: GBin1.com. Charisma是一套全功能的,免费,会员质量的响应式HTML5管理员界面模板,基于 "Bootstrap",拥有了9套不同的主题颜色内容,可以满足你的不同需要. 完全响应式,针对了移动设备和触摸设备优化. 基于bootstrap,同时也支持jQuery UI.