下一代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函数中的arguments参数
Aug 01 Javascript
JavaScript 5 新增 Array 方法实现介绍
Feb 06 Javascript
原生js实现shift/ctrl/alt按键的获取
Apr 08 Javascript
100个不能错过的实用JS自定义函数
Mar 05 Javascript
搭建pomelo 开发环境
Jun 24 Javascript
js用Date对象的setDate()函数对日期进行加减操作
Sep 18 Javascript
JS实现一个列表中包含上移下移删除等功能
Sep 24 Javascript
jquery实现兼容IE8的异步上传文件
Jun 15 Javascript
Canvas实现放射线动画效果
Feb 15 Javascript
js登录滑动验证的实现(不滑动无法登陆)
Jan 03 Javascript
vue-router 手势滑动触发返回功能
Sep 30 Javascript
ES6常用小技巧总结【去重、交换、合并、反转、迭代、计算等】
Dec 21 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
Protoss魔法科技
2020/03/14 星际争霸
php字符串截取中文截取2,单字节截取模式
2007/12/10 PHP
通俗易懂的php防注入代码
2010/04/07 PHP
基于php无限分类的深入理解
2013/06/02 PHP
Thinkphp中volist标签mod控制一定记录的换行BUG解决方法
2014/11/04 PHP
PHP7.1实现的AES与RSA加密操作示例
2018/06/15 PHP
php使用gearman进行任务分发操作实例详解
2020/02/26 PHP
JavaScript使用ActiveXObject访问Access和SQL Server数据库
2015/04/02 Javascript
JQuery查找DOM节点的方法
2015/06/11 Javascript
jQuery+jsp实现省市县三级联动效果(附源码)
2015/12/03 Javascript
AngularJS中的过滤器filter用法完全解析
2016/04/22 Javascript
JS获取鼠标位置距浏览器窗口距离的方法示例
2017/04/11 Javascript
[js高手之路]图解javascript的原型(prototype)对象,原型链实例
2017/08/28 Javascript
关于预加载InstantClick的问题解决方法
2017/09/12 Javascript
vue.js实现标签页切换效果
2018/06/07 Javascript
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
2018/09/04 Javascript
解决vuejs项目里css引用背景图片不能显示的问题
2018/09/13 Javascript
javascript动态创建对象的属性详解
2018/11/07 Javascript
js图片无缝滚动插件使用详解
2020/05/26 Javascript
layui use 定义js外部引用函数的方法
2019/09/26 Javascript
详解vue之自行实现派发与广播(dispatch与broadcast)
2021/01/19 Vue.js
python使用电子邮件模块smtplib的方法
2016/08/28 Python
通过Python模块filecmp 对文件比较的实现方法
2018/06/29 Python
python 通过 socket 发送文件的实例代码
2018/08/14 Python
Flask核心机制之上下文源码剖析
2018/12/25 Python
Python生成MD5值的两种方法实例分析
2019/04/26 Python
python 中的列表生成式、生成器表达式、模块导入
2019/06/19 Python
一行Python代码过滤标点符号等特殊字符
2019/08/12 Python
解决pytorch报错:AssertionError: Invalid device id的问题
2020/01/10 Python
软件测试企业面试试卷
2016/07/13 面试题
关爱残疾人标语
2014/06/25 职场文书
党的群众路线教育实践活动对照检查材料思想汇报(党员篇)
2014/09/25 职场文书
中学生检讨书1000字
2014/10/28 职场文书
超市工作总结范文2014
2014/12/19 职场文书
用python删除文件夹中的重复图片(图片去重)
2021/05/12 Python
关于MySQL临时表为什么可以重名的问题
2022/03/22 MySQL