Bootstrap4一次重大更新 几乎涉及每行代码


Posted in Javascript onMay 16, 2016

对Bootstrap来说去年8月19日是个特别的日子——不仅是项目四周年纪念日,也是经过了一年密集开发之后发布Bootstrap 4内测版的日子。Bootstrap 4是一次重大更新,几乎涉及每行代码。

1、新增功能

Bootstrap4一次重大更新 几乎涉及每行代码

Bootstrap 4中有太多重大的更新,本文不能面面俱到,下面是一些颇受关注的亮点:

从Less迁移到Sass: 现在,Bootstrap已加入Sass的大家庭中。得益于Libsass,Bootstrap的编译速度比以前更快;
改进网格系统:新增一个网格层适配移动设备,并整顿语义混合。
支持选择弹性盒模型(flexbox):这是项划时代的功能——只要修改一个Boolean变量,就可以利用flexbox的优势快速布局。
废弃了wells、thumbnails和panels,使用cards代替:Cards是个全新概念,但使用起来与wells、thumbnails及panels很像,且更方便。
将所有HTML重置样式表整合到Reboot中:在用不了Normalize.css的地方可以用Reboot了,它提供了更多选项。例如box-sizing: border-box、margin tweaks等都存放在一个单独的 Sass 文件中。
新的自定义选项:不再像上个版本一样,将渐变、淡入淡出、阴影等效果分放在单独的样式表中。而是将所有选项都移到一个Sass变量中。想要给全局或考虑不到的角落定义一个默认效果?很简单,只要更新变量值,然后重新编译就可以了。
不再支持IE8,使用rem和em单位:放弃对IE8的支持意味着开发者可以放心地利用CSS的优点,不必研究css hack技巧或回退机制了。使用rem和em代替px单位,更适合做响应式布局,控制组件大小。如果要支持IE8,只能继续用Bootstrap 3。
重写所有JavaScript插件:为了利用JavaScript的新特性,Bootstrap 4用ES6重写了所有插件。现在提供UMD支持、泛型拆解方法、选项类型检查等特性。
改进工具提示和popovers自动定位:这部分要感谢Tether工具的帮助。
改进文档:所有文档以Markdown格式重写,添加了一些方便的插件组织示例和代码片段,文档使用起来会更方便,搜索的优化工作也在进行中。
更多变化:支持自定义窗体控件、空白和填充类,此外还包括新的实用程序类等。
以上更新只是冰山一角, v4版共有1100多次commits和 12万行代码更新,这些更新可以在v4-alpha文档中查看。

2、开发计划

v4版本所有的源代码都在Github的v4-dev分支上开源。此外,还有一个v4开发和跟踪pr ,公布master的changes列表和待开发列表。大家可以贡献自己的代码,来让这个项目变得更好。

总体的开发和发布计划如下:

还会在不断改进中发布几个alpha版本; 新特性和新功能冻结之后发布两个Beta版本进行充分测试; 发布 2 个候选版本,测试是否能用于生产环境; 发布最终版本。

Slack上还有个专门讨论v4的频道,Bootstrapers可以点击这里加入。

3、支持v3

发布Bootstrap 3时,Bootstrap曾放弃了对2.x版本的支持,给很多用户造成了麻烦,同样的错误不会犯第二次。在不久的将来,开发团队还会继续修复v3的bug,改进文档。v4最终发布之后,v3的文档也不会下线。

4、One more thing……

除了发布Bootstrap 4 alpha外,官方还发布了Bootstrap主题。

Bootstrap4一次重大更新 几乎涉及每行代码这些主题耗费的精力很大,它们自己就有很多工具集,和Bootstrap本身一样。

作为开始,发布的主题有: dashboard, application,和marketing,使用multiple-use license 协议。

点击这里查看更多主题信息。

5、反馈

1)有人提到,在v3.5.5(最后的稳定版本)中,bootstrap.min.css是123KB,而在新的4.0.0alpha bootstrap.min.css 中只有88KB,值得庆祝。

2)有人反馈说dashboard主题并不是完完全全的响应式,比如在tables->order history中。

3)Bootstrap改成默认使用Sass,引起了广泛的讨论。

4)也有人表示,一个组织愿意放弃旧技术(不再支持IE8)用新技术(ES6)来重写库,值得尊敬。

如果大家还想深入学习,可以点击这里进行学习,再为大家附3个精彩的专题:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(7)
Dec 23 Javascript
Jquery实现兼容各大浏览器的Enter回车切换输入焦点的方法
Sep 01 Javascript
jQuery实现在textarea指定位置插入字符或表情的方法
Mar 11 Javascript
jQuery实现tab选项卡效果的方法
Jul 08 Javascript
基于Bootstrap的Metronic框架实现条码和二维码的生成及打印处理操作
Aug 29 Javascript
js绘制购物车抛物线动画
Nov 18 Javascript
利用js编写网页进度条效果
Oct 08 Javascript
React 组件转 Vue 组件的命令写法
Feb 28 Javascript
create-react-app 修改为多入口编译的方法
Aug 01 Javascript
AngularJS与后端php的数据交互方法
Aug 13 Javascript
vue.js 打包时出现空白页和路径错误问题及解决方法
Jun 26 Javascript
适合前端Vue开发童鞋的跨平台Weex的使用详解
Oct 16 Javascript
JS获取元素多层嵌套思路详解
May 16 #Javascript
怎么限制input的text里输入的值只能是数字(正则、js)
May 16 #Javascript
BootStrap点击下拉菜单项后显示一个新的输入框实现代码
May 16 #Javascript
在javascript中创建对象的各种模式解析
May 16 #Javascript
Bootstrap3 input输入框插入glyphicon图标的方法
May 16 #Javascript
论Bootstrap3和Foundation5网格系统的异同
May 16 #Javascript
Javascript基础教程之比较null和undefined值
May 16 #Javascript
You might like
利用discuz自带通行证整合dedecms的方法以及文件下载
2007/03/06 PHP
php使用curl发送json格式数据实例
2013/12/17 PHP
thinkphp连贯操作实例分析
2014/11/22 PHP
thinkPHP框架对接支付宝即时到账接口回调操作示例
2016/11/14 PHP
javascript之typeof、instanceof操作符使用探讨
2013/05/19 Javascript
jQuery的显示和隐藏方法与css隐藏的样式对比
2013/10/18 Javascript
深入解析JavaScript的闭包机制
2015/10/20 Javascript
JavaScript、tab切换完整版(自动切换、鼠标移入停止、移开运行)
2016/01/05 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
2016/01/12 Javascript
一种基于浏览器的自动小票机打印实现方案(js版)
2016/07/26 Javascript
常用原生js自定义函数总结
2016/11/20 Javascript
原生js实现对Ajax的封装(仿jquery)
2017/01/22 Javascript
bootstrap fileinput 插件使用项目总结(经验)
2017/02/22 Javascript
vue+axios实现登录拦截的实例代码
2017/05/22 Javascript
详解webpack+vue-cli项目打包技巧
2017/06/17 Javascript
网页中的图片查看器viewjs使用方法
2017/07/11 Javascript
JS实现手写parseInt的方法示例
2017/09/24 Javascript
JavaScript获取移动设备型号的实现代码(JS获取手机型号和系统)
2018/03/10 Javascript
React中使用UEditor百度富文本的方法
2018/08/22 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
vue 验证码界面实现点击后标灰并设置div按钮不可点击状态
2019/10/28 Javascript
在vue-cli中引入lodash.js并使用详解
2019/11/13 Javascript
JS深入学习之数组对象排序操作示例
2020/05/01 Javascript
解决vuex改变了state的值,但是页面没有更新的问题
2020/11/12 Javascript
Python列出一个文件夹及其子目录的所有文件
2016/06/30 Python
Python使用win32 COM实现Excel的写入与保存功能示例
2018/05/03 Python
使用python读取.text文件特定行的数据方法
2019/01/28 Python
详解Django项目中模板标签及模板的继承与引用(网站中快速布置广告)
2019/03/27 Python
Python更新所有已安装包的操作
2020/02/13 Python
纯css3实现图片翻牌特效
2015/03/10 HTML / CSS
详解CSS3浏览器兼容
2016/12/14 HTML / CSS
菲律宾领先的在线时尚商店:Zalora菲律宾
2018/02/08 全球购物
八一建军节感言
2014/02/28 职场文书
网络编辑求职信
2014/04/30 职场文书
运动会横幅标语
2014/06/17 职场文书
党的群众路线领导班子整改方案
2014/09/27 职场文书