Bootstrap3 与 Bootstrap4 官网地址

Bootstrap3 官网：https://v3.bootcss.com

Bootstrap4 官网：https://v4.bootcss.com

Bootstrap4 特点

  • 新增网格层适配移动端

  • 全面引入ES6新特性（重写所有JavaScript插件）

  • css文件减少了至少40%

  • 所有文档都用Markdown编辑器重写

  • 放弃对IE8的支持

Bootstrap3 与 Bootstrap4 区别

Bootstrap3 Bootstrap4
Less Sass语言编写
4种栅格类 5种栅格类
使用px为单位 使用rem和em为单位（除部分margin和padding使用px）
使用push和pull向左右移动 偏移列通过offset-类设置
使用float的布局方式 选择弹性盒模型（flexbox）
Bootstrap3的4种栅格：

特小（col-xs-） 适配手机(<768px)

小（col-sm-） 适配平板(≥768px)

中（col-md-） 适配电脑(≥992px)

大（col-lg-） 适配宽屏电脑(≥1200px)

Bootstrap4的5种栅格：

特小（col-）(<576px)

小（col-sm-）(≥576px)

中（col-md-）(≥768px)

大（col-lg-） (≥992px)

特大（col-xl-）（≥1200px）

Bootstrap Bootstrap3 与 Bootstrap4 的区别的更多相关文章

  1. Bootstrap3和Bootsrap4的区别

    Bootstrap3和Bootstap4的区别 1.Bootsrap4 css文件减少了40%以上 2.Bootsrap4已经不支持IE8以及IOS 6的支持 3.多了些类好组件

  2. springboot：bootstrap和application有什么区别？

    bootstrap和application区别: Spring Cloud 构建于 Spring Boot 之上,在 Spring Boot 中有两种上下文,一种是 bootstrap,另外一种是 a ...

  3. <bootstrap>bs2和3的区别</bootstrap>

    实验室的list网站开始动工了,准备打算用bootstrap作布局. 大前天去本部停了长html5峰会大连站的讲演,着急往回赶,很多感兴趣的东西都没有听到,但是还是了解了一些html5的新特性 电脑端 ...

  4. spring cloud 配置文件application.yml和bootstrap.yml 的定位，区别和联系

    最近在启用springcloud配置中心server的东西,在整理属性资源的时候,突然发现:用了这么久的springboot,为什么会配置两个属性文件同时存在(application.yml/prop ...

  5. spring cloud 配置文件application.yml和bootstrap.yml 的定位，区别和联系总算是有一点明白了

    最近在启用springcloud配置中心server的东西,在整理属性资源的时候,突然发现:用了这么久的springboot,为什么会配置两个属性文件同时存在(application.yml/prop ...

  6. springboot（二）：bootstrap和application有什么区别？

    “SpringBoot专注于快速方便的开发单个个体微服务. SpringCloud是关注全局的微服务协调整理治理框架,它将SpringBoot开发的一个个单体微服务整合并管理起来, 为各个服务之间提供 ...

  7. twitter bootstrap 2.x 3.x区别

    栅格系统 (Grid system)说个我认为比较重要的,相对于RC 1中的3层,现在有4层了 We now have .col-xs (phones), .col-sm (tablets), .co ...

  8. Mac系统使用VS Code编译Bootstrap 4

    环境: macOS 10.13.6 node.js 8.11.3 sass 1.10.3 bootstrap 4.1.3 vs code 1.25.1 Bootstrap3为我们提供了在线编译工具,可 ...

  9. Bootstrap4 网格系统

    学习注意事项 col-*-* 第一个*是设备类型,第二个*是控件宽度的占比 屏幕被等分为12,col-1宽度是1/12,col-6宽度是50%,col-12宽度是100% 给应用了class的elem ...

随机推荐

  1. 研发效率破局之道 Facebook工作法

    如果你问中国和美国互联网公司都有什么差别,很多人会回答:低效加班文化.最近爆出的996大讨论,通过糙快猛打拼和996加班去抢占市场获得机会的成功案例越来越少.至此,只有提高效能才是出路. 由于软件开发 ...

  2. css详解background八大属性及其含义

    background(背景) 以前笔者在css盒模型以及如何计算盒子的宽度一文中提到过盒模型可以看成由 元素外边距(margin).元素边框(border).元素内边距(padding)和元素内容(c ...

  3. （十）VMware Harbor 日志管理

    VMware Harbor 日志管理 1. 项目日志 每个项目下都有一个"日志"页签. 单击"日志"可以列出所有日志.可以按用户名或"高级搜索&quo ...

  4. 11. VUE 数组操作

    变异方法 Vue 包含一组观察数组的变异方法,所以它们也将会触发视图更新.这些方法如下: push() 添加元素 <ul id="example-1"> <li ...

  5. 并发编程之ThreadLocal

    并发编程之ThreadLocal 前言 当多线程访问共享可变数据时,涉及到线程间同步的问题,并不是所有时候,都要用到共享数据,所以就需要线程封闭出场了. 数据都被封闭在各自的线程之中,就不需要同步,这 ...

  6. 火狐兼容selenium版本解决

    火狐和selenium不是很好兼容,下面提供一些我所知道的可以兼容的版本: 1. 火狐52+selenium 3.3 +geckodriver v0.15.0 2.火狐59+selenium 3.11 ...

  7. Day17_106_IO_利用Buffered和BufferWriter完成复制

    利用Buffered和BufferWriter完成复制 代码示例: 用BufferedReader 和 BufferWriter完成复制 import java.io.*; public class ...

  8. SQL Server 审计（Audit）

    审计(Audit)用于追踪和记录SQL Server实例,或者单个数据库中发生的事件(Event),审计运作的机制是通过捕获事件(Event),把事件包含的信息写入到事件日志(Event Log)或审 ...

  9. 02- web UI测试与UI Check List

    UI英文是 user interface .所以UI测试就是用户界面测试. Web UI测试 用户界面测试:user interface testing,UI Testing指软件中的可见外观及其与用 ...

  10. PHP 导出 Excel 兼容 CSV XlS格式

    class ExcelRead { /** * 获取Excel文件内容 * @param $file * @return mixed * @throws PHPExcel_Reader_Excepti ...