下一代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 相关文章推荐
基于jquery实现控制经纬度显示地图与卫星
May 20 Javascript
JS在TextArea光标位置插入文字并实现移动光标到文字末尾
Jun 21 Javascript
jquery可见性过滤选择器使用示例
Jun 24 Javascript
jquery判断至少有一个checkbox被选中的方法
Jun 05 Javascript
javascript数据结构之二叉搜索树实现方法
Nov 25 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记6)
Dec 20 Javascript
Vue和Bootstrap的整合思路详解
Jun 30 Javascript
iview中Select 选择器多选校验方法
Mar 15 Javascript
vue使用原生swiper代码实例
Feb 05 Javascript
JavaScript使用canvas绘制随机验证码
Feb 17 Javascript
ElementUI中el-tree节点的操作的实现
Feb 27 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
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开发模式(简写版)
2007/03/15 PHP
php 在windows下配置虚拟目录的方法介绍
2013/06/26 PHP
利用js跨页面保存变量做菜单的方法
2008/01/17 Javascript
javascript for循环设法提高性能
2010/02/24 Javascript
Jquery+JSon 无刷新分页实现代码
2010/04/01 Javascript
ExtJS Store的数据访问与更新问题
2010/04/28 Javascript
JavaScript中数组的排序、乱序和搜索实现代码
2011/11/30 Javascript
JavaScript中setInterval的用法总结
2013/11/20 Javascript
Egret引擎开发指南之视觉编程
2014/09/03 Javascript
Bootstrap每天必学之js插件
2015/11/30 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
NodeJS实现客户端js加密
2017/01/09 NodeJs
利用JS实现简单的日期选择插件
2017/01/23 Javascript
vue页面使用阿里oss上传功能的实例(一)
2017/08/09 Javascript
常用的 JS 排序算法 整理版
2018/04/05 Javascript
mpvue+vant app搭建微信小程序的方法步骤
2019/02/11 Javascript
如何将百度地图包装成Vue的组件的方法步骤
2019/02/12 Javascript
浅谈一种让小程序支持JSX语法的新思路
2019/06/16 Javascript
浅谈Vue项目骨架屏注入实践
2019/08/05 Javascript
js实现超级玛丽小游戏
2020/03/18 Javascript
基于js实现逐步显示文字输出代码实例
2020/04/02 Javascript
跟老齐学Python之正规地说一句话
2014/09/28 Python
两个命令把 Vim 打造成 Python IDE的方法
2016/03/20 Python
利用numpy和pandas处理csv文件中的时间方法
2018/04/19 Python
python 巧用正则寻找字符串中的特定字符的位置方法
2018/05/02 Python
mac下pycharm设置python版本的图文教程
2018/06/13 Python
python如何创建TCP服务端和客户端
2018/08/26 Python
不管你的Python报什么错,用这个模块就能正常运行
2018/09/14 Python
numpy下的flatten()函数用法详解
2019/05/27 Python
浅谈Python type的使用
2019/11/19 Python
基于Python和PyYAML读取yaml配置文件数据
2020/01/13 Python
python利用opencv实现SIFT特征提取与匹配
2020/03/05 Python
2020新版本pycharm+anaconda+opencv+pyqt环境配置学习笔记,亲测可用
2020/03/24 Python
纽约现代艺术博物馆商店:MoMA STORE(室内家具和杂货商品)
2016/08/02 全球购物
领班岗位职责范文
2014/02/06 职场文书
2016年推广普通话宣传周活动总结
2016/04/06 职场文书