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 自定义类型方法小结
Mar 02 Javascript
AJAX 网页保留浏览器前进后退等功能
Feb 12 Javascript
下拉菜单点击实现连接跳转功能的js代码
May 19 Javascript
js点击button按钮跳转到另一个新页面
Oct 10 Javascript
jquery捕捉回车键及获取checkbox值与异步请求的方法
Dec 24 Javascript
Bootstrap基本组件学习笔记之面板(14)
Dec 08 Javascript
Vue指令的钩子函数使用方法
Mar 20 Javascript
jQuery插件HighCharts绘制2D饼图效果示例【附demo源码下载】
Mar 21 jQuery
基于layui内置模块(element常用元素的操作)
Sep 20 Javascript
Vue在chrome44偶现点击子元素事件无法冒泡的解决方法
Dec 15 Javascript
利用原生JS实现欢乐水果机小游戏
Apr 23 Javascript
JavaScript中的几种继承方法示例
Dec 06 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
用PHP连接Oracle for NT 远程数据库
2006/10/09 PHP
PHP URL地址获取函数代码(端口等) 推荐
2010/05/15 PHP
php自定义类fsocket模拟post或get请求的方法
2015/07/31 PHP
phplist及phpmailer(组合使用)通过gmail发送邮件的配置方法
2016/03/30 PHP
php上传图片类及用法示例
2016/05/11 PHP
PHP异常处理定义与使用方法分析
2017/07/25 PHP
浅析PHP数据导出知识点
2018/02/17 PHP
PHP5.0~5.6 各版本兼容性cURL文件上传功能实例分析
2018/05/11 PHP
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
javascript 使td内容不换行不撑开
2012/11/29 Javascript
解决Extjs 4 Panel作为Window组件的子组件时出现双重边框问题
2013/01/11 Javascript
js实现单一html页面两套css切换代码
2013/04/11 Javascript
利用JS解决ie6不支持max-width,max-height问题的方法
2014/01/02 Javascript
js写的方法实现上传图片之后查看大图
2014/03/05 Javascript
easyui datagrid 大数据加载效率慢,优化解决方法(推荐)
2016/11/09 Javascript
JavaScript数据结构之二叉树的删除算法示例
2017/04/13 Javascript
vue-cli axios请求方式及跨域处理问题
2018/03/28 Javascript
Vue.js进阶知识点总结
2018/04/01 Javascript
Vue不能观察到数组length的变化
2018/06/08 Javascript
微信小程序实现循环动画效果
2018/07/16 Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
2018/09/03 jQuery
iView-admin 动态路由问题的解决方法
2018/10/03 Javascript
[01:33]DOTA2上海特级锦标赛 LIQUID战队完整宣传片
2016/03/16 DOTA
[00:14]护身甲盾
2019/03/06 DOTA
用pickle存储Python的原生对象方法
2017/04/28 Python
解决matplotlib库show()方法不显示图片的问题
2018/05/24 Python
使用python实现快速搭建简易的FTP服务器
2018/09/12 Python
Python补齐字符串长度的实例
2018/11/15 Python
Elasticsearch py客户端库安装及使用方法解析
2020/09/14 Python
canvas压缩图片以及卡片制作的方法示例
2018/12/04 HTML / CSS
澳大利亚女性快速时尚零售商:Ally Fashion
2018/04/25 全球购物
双立人美国官方商店:ZWILLING集团餐具和炊具
2020/05/07 全球购物
2014年五一劳动节社区活动总结
2014/04/14 职场文书
采购部长岗位职责
2014/06/13 职场文书
人力资源部岗位职责
2015/02/11 职场文书
幼儿园六一儿童节主持词
2015/06/30 职场文书