读书频道 > 网站 > 网页设计 > Bootstrap实战
2.Bootstrap 2
2013-11-02 13:43:08     我来说两句 
收藏    我要投稿   

本文所属图书 > Bootstrap实战

本书由国内资深前端工程师撰写,是目前内容最为全面和深入的Bootstrap专著。它不仅系统讲解了Bootstrap的各项功能和使用方法,详细讲解了Bootstrap的组件、插件和扩展技术,而且深度解析了Bootstrap的内核源代码  立即去当当网订购

2012年1月,Twitter在开发者博客上公布消息,其6个月前发布的轻量级前端开发工具Bootstrap迎来重大改进,正式升级为Bootstrap 2。和Bootstrap 1一样,Bootstrap 2仍然是一个托管在GitHub上的开源项目。

在开发Bootstrap 2的过程中,Mark Otto参考了不少来自社区的意见并借鉴了自己在Twitter前端重新设计过程中积累的经验。除了增加新样式外,Bootstrap 2修改了一些网页元素的默认样式,除去了上一版本中的几十个bug,同时完善了说明文档。BootStrap 2在原有特性的基础上着重改进了用户的体验和交互性,比如新增加的媒体展示功能,适用于智能手机上多种屏幕规格的响应式布局,另外还新增了12款jQuery插件,可以满足Web页面常用的用户体验和交互功能。

Bootstrap 2的一个重大改进是添加了响应式设计特性,Bootstrap 1中并不支持这一特性,这让很多开发人员不满。为了提供更好地针对移动设备的响应式设计方案,Bootstrap 2采用了更为灵活的12栏栅格布局。此外,它还更新了一些进度栏以及可定制的图片缩略图,并增加了一些新样式。值得关注的是,Bootstrap是一个非常轻量级的框架,Bootstrap 2在压缩后也只有10KB。

Bootstrap 2采用了更灵活也更受欢迎的12栏栅格布局,并以此来实现其各种布局框架;增加了响应式设计,以适应各种移动终端的需求;完善和改进了原有样式库,并提供了更丰富的新样式,包括样式繁多的图标、漂亮易用的进度条等;改进和增加了自定义jQuery插件,完善文档,修复bug,同时还提供了很多基于Bootstrap构建的网站样例。已经使用Bootstrap 1.4的开发者也不用担心,Bootstrap专门提供了从Bootstrap 1.4升级到Bootstrap 2的手工向导可以参考。

Bootstrap 2对现有框架进行了清晰的功能划分,主要分为脚手架(Scaffolding)、基础CSS、构件库和jQuery插件库。

Scaffolding主要提供基于网格的各种布局,包括普通栅格系统、嵌入式栅格、固定布局、自适应布局,同时可以自定义网格和布局。Bootstrap 2提供了响应式设计,可以通过单个文件支持各种手持设备,自适应不同的设备和屏幕变化。

基础CSS包括各种排版样式(标题、段落、引用块、列表、内联标签等),在代码展示方面提供了基于code标签的内嵌代码,基于pre的块代码和基于Google Prettify的代码样式。此外,提供各种表格、表单、按钮、图标的展示方式。

构件库提供了基于按钮、导航、标签、排版、警告、进度栏、图像网格等控件。

jQuery插件库则提供了十几种插件实现动态效果,例如模态对话框、下拉项、标签页、工具提示、弹出提示、轮播等,开发者可以根据自己的业务需求使用不同的插件实现各种动态效果。

应用Bootstrap 2的案例有NASA(http://code.nasa.gov/,见图1-8)和MSNBC的BREAKING NEWS(http://www.breakingnews.com/,见图1-9)。

 

Bootstrap 2升级的细节请参考http://twitter.github.io/bootstrap/upgrading.html

 

点击复制链接 与好友分享!回本站首页
分享到: 更多
您对本文章有什么意见或着疑问吗?请到论坛讨论您的关注和建议是我们前行的参考和动力  
上一篇:1.4 Bootstrap版本变化
下一篇:3.Bootstrap 3
相关文章
图文推荐
JavaScript网页动画设
1.9 响应式
1.8 登陆页式
1.7 主题式
排行
热门
文章
下载
读书

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训
版权所有: 红黑联盟--致力于做最好的IT技术学习网站