下一代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 相关文章推荐
js汉字转拼音实现代码
Feb 06 Javascript
javascript实现ecshop搜索框键盘上下键切换控制
Mar 18 Javascript
很全面的JavaScript常用功能汇总集合
Jan 22 Javascript
Javarscript中模块(module)、加载(load)与捆绑(bundle)详解
May 28 Javascript
详解vue组件通信的三种方式
Jun 30 Javascript
JS使用正则表达式获取小括号、中括号及花括号内容的方法示例
Jun 01 Javascript
vue实现动态添加数据滚动条自动滚动到底部的示例代码
Jul 06 Javascript
Vue slot用法(小结)
Oct 22 Javascript
vue 实现左右拖拽元素并且不超过他的父元素的宽度
Nov 30 Javascript
JS简单判断是否在微信浏览器打开的方法示例
Jan 08 Javascript
vue全屏事件开发详解
Jun 17 Javascript
解决vue项目运行npm run serve报错的问题
Oct 26 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
对盗链说再见...
2006/10/09 PHP
利用static实现表格的颜色隔行显示
2006/10/09 PHP
PHP cron中的批处理
2008/09/16 PHP
php中根据变量的类型 选择echo或dump
2012/07/05 PHP
php实现监控varnish缓存服务器的状态
2014/12/30 PHP
PHP数组和explode函数示例总结
2015/05/08 PHP
作为程序员必知的16个最佳PHP库
2015/12/09 PHP
php使用json-schema模块实现json校验示例
2019/09/28 PHP
PHPstorm启用自动换行的方法详解(IDE)
2020/09/17 PHP
checkbox使用示例
2013/08/23 Javascript
js函数内变量的作用域分析
2015/01/12 Javascript
javascript将异步校验表单改写为同步表单
2015/01/27 Javascript
Jquery遍历Json数据的方法
2015/04/20 Javascript
jquery简单实现图片切换效果的方法
2015/05/12 Javascript
jQuery基于ajax实现星星评论代码
2015/08/07 Javascript
Node.js DES加密的简单实现
2016/07/07 Javascript
微信小程序开发(一) 微信登录流程详解
2017/01/11 Javascript
无限循环轮播图之运动框架(原生JS实现)
2017/10/01 Javascript
vue使用nprogress实现进度条
2019/12/09 Javascript
python通过BF算法实现关键词匹配的方法
2015/03/13 Python
Python开发之快速搭建自动回复微信公众号功能
2016/04/22 Python
详解python之配置日志的几种方式
2017/05/22 Python
Python中序列的修改、散列与切片详解
2017/08/27 Python
Python迭代器和生成器定义与用法示例
2018/02/10 Python
关于pymysql模块的使用以及代码详解
2019/09/01 Python
Python交互环境下打印和输入函数的实例内容
2020/02/16 Python
英国最大的独立玩具专卖店:The Entertainer
2019/09/06 全球购物
New Balance俄罗斯官方网上商店:购买运动鞋
2020/03/02 全球购物
习近平在党的群众路线教育实践活动总结大会上的讲话全文
2014/10/25 职场文书
金融专业银行实习证明模板
2014/11/28 职场文书
入党函调证明材料
2014/12/24 职场文书
2015年助理工程师工作总结
2015/04/03 职场文书
化妆品促销活动总结
2015/05/07 职场文书
父母教会我观后感
2015/06/17 职场文书
个人房屋租赁合同(标准范本)
2019/09/16 职场文书
使用Djongo模块在Django中使用MongoDB数据库
2021/06/20 Python