下一代Bootstrap的5个特点 超酷炫!


Posted in Javascript onJune 17, 2016

Bootstrap 4的初始版已经发布很久,还是希望大家都可以认识到,这是对这个流行的(可能是最流行的)响应式CSS框架一次重大的彻底整修。该项目创始人,Mark Otto说这次的发布“几乎涉及每一行代码”,这并不是在开玩笑。

下一代Bootstrap的5个特点 超酷炫! 

1.更轻巧的文件大小
 有这样一句话,“删掉的代码必定是已经调试过的代码,”——最好的重构一定会导致项目删除大量代码,迅速瘦身。如果你下载初始版本,那么你会发现,与最新的稳定版本Bootstrap 3(3.3.5)——约为123KB大小(bootstrap.min.css文件)——相比,新的4.0.0初始bootstrap.min.css仅约为88KB。这可能是得益于IE8的支持。

2.从LESS切换到Sass 
社区和性能是Bootstrap决定在版本4中作此切换的两个主要原因。特别是,争论的依据为:
----SaaS项目比LESS迭代更快
----切换到Sass提高了框架的性能

然而,从GitHub的页面来看,LESS看上去仍具有人气的优势,但Bootstrap表示,Sass增长的速度非常快。无论哪种方式,你都可以用正确的方法在Bootstrap 3中的Sass里做很多CSS编码工作。有些人在怀疑的是,PostCSS——一款极有前途的模块化工具,是否有强大的性能做预处理工作,以及是否应该替代LESS。 

3.切换Flexbox支持
 Bootstrap 4现在支持使用W3C的Flexbox功能,Flexbox功能依然可以消弭所有浏览器的支持。出于这个原因,这是一个可选功能,如果需要的话,可以打开。
 如果你需要快速复习Flexbox,那么我给你推荐一个指南—— 《A Complete Guide to Flexbox》 。还有新出来的关于Flexbox的一个视频系列,如果你更喜欢这种方式的话。 

4.重新调整卡片式UI布局模式
 我和Andrew Trice都认为这是一个早在2013年谷歌的Material Design中就应该理解的重要的UI布局模式,现在Bootstrap 4将所有的筹码都压在了这一趋势上。Bootstrap废弃了wells、thumbnails和panels,转而使用cards代替。

 下一代Bootstrap的5个特点 超酷炫!

5.在ES6中重写JS插件
 ECMAScript 6在几个月前终于定稿和标准化,Bootstrap紧跟这一最新的web技术。他们已经重写了所有的JavaScript插件以便于利用ES6的优势,并且他们也已经更新了一起的插件,“UMD支持,通用的拆卸方法,选择类型检查,等等等等。”

译文链接:http://www.codeceo.com/article/bootstrap-5-cool-things.html
英文原文:5 Cool Things About the Next Version of Bootstrap
翻译作者:码农网 ? 小峰

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

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

Javascript 相关文章推荐
javascript new后的constructor属性
Aug 05 Javascript
jQuery的实现原理的模拟代码 -5 Ajax
Aug 07 Javascript
jQuery EasyUI datagrid实现本地分页的方法
Feb 13 Javascript
JS控制网页动态生成任意行列数表格的方法
Mar 09 Javascript
jQuery 1.9.1源码分析系列(十)事件系统之绑定事件
Nov 19 Javascript
javascript自定义滚动条实现代码
Apr 20 Javascript
浅谈jquery之on()绑定事件和off()解除绑定事件
Oct 26 Javascript
javascript编程实现栈的方法详解【经典数据结构】
Apr 11 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
Jan 18 Javascript
jQuery实现B2B网站后台管理系统侧导航
Jul 08 jQuery
你不知道的 TypeScript 高级类型(小结)
Aug 28 Javascript
Ant Design Vue table中列超长显示...并加提示语的实例
Oct 31 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
Jun 17 #Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
Jun 17 #Javascript
基于Bootstrap的UI扩展 StyleBootstrap
Jun 17 #Javascript
Bootstrap前端开发案例二
Jun 17 #Javascript
jQuery查看选中对象HTML代码的方法
Jun 17 #Javascript
Bootstrap前端开发案例一
Jun 17 #Javascript
JS实现的自定义水平滚动字体插件完整实例
Jun 17 #Javascript
You might like
PHP初学者头疼问题总结
2006/10/09 PHP
php中socket的用法详解
2014/10/24 PHP
php DES加密算法实例分析
2019/09/18 PHP
JavaScript 对象的属性和方法4种不同的类型
2010/03/19 Javascript
js获取TreeView控件选中节点的Text和Value值的方法
2012/11/24 Javascript
用jQuery模拟select下拉框的简单示例代码
2014/01/26 Javascript
如何使用Bootstrap的modal组件自定义alert,confirm和modal对话框
2016/03/01 Javascript
酷炫jQuery全屏3D焦点图动画效果
2016/03/22 Javascript
JS实现留言板功能[楼层效果展示]
2017/12/27 Javascript
详解Vue开发微信H5微信分享签名失败问题解决方案
2018/08/09 Javascript
vue添加class样式实例讲解
2019/02/12 Javascript
vue+vuex+json-seiver实现数据展示+分页功能
2019/04/11 Javascript
uni-app如何页面传参数的几种方法总结
2020/04/28 Javascript
vue 保留两位小数 不能直接用toFixed(2) 的解决
2020/08/07 Javascript
[01:59]翻天覆地,因你而变,7.20版本地图更新速览
2018/11/24 DOTA
用Python实现web端用户登录和注册功能的教程
2015/04/30 Python
python遍历文件夹下所有excel文件
2018/01/03 Python
Python操作Redis之设置key的过期时间实例代码
2018/01/25 Python
python多进程实现文件下载传输功能
2018/07/28 Python
python3+PyQt5 使用三种不同的简便项窗口部件显示数据的方法
2019/06/17 Python
对python 调用类属性的方法详解
2019/07/02 Python
PyQt5基本控件使用之消息弹出、用户输入、文件对话框的使用方法
2019/08/06 Python
Python 中pandas索引切片读取数据缺失数据处理问题
2019/10/09 Python
Python中base64与xml取值结合问题
2019/12/22 Python
django 模型中的计算字段实例
2020/05/19 Python
python 中关于pycharm选择运行环境的问题
2020/10/31 Python
美国大码时尚女装购物网站:ELOQUII
2017/12/28 全球购物
优秀体育委员自荐书
2014/01/31 职场文书
讲文明树新风公益广告宣传方案
2014/02/25 职场文书
党员公开承诺践诺书
2014/03/25 职场文书
2014年世界艾滋病日演讲稿
2014/11/28 职场文书
药店营业员岗位职责
2015/04/14 职场文书
女性健康知识讲座主持词
2015/07/04 职场文书
城镇居民医疗保险工作总结
2015/08/10 职场文书
2016高校自主招生自荐信范文
2016/01/28 职场文书
SQL Server的存储过程与触发器以及系统函数和自定义函数
2022/04/10 SQL Server