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. Appium 自动化测试框架:关键字驱动+数据驱动

    1. 关键字驱动框架简介 2. 框架结构说明 3. 框架代码实现 action 包  page_action.py business_process 包 case_process.py data_so ...

  2. IOS Widget(1):概述

    引言   本系列文章作者是安卓开发,以安卓开发的视角学习IOS小组件,记录一下踩坑记录,如有讲得不对的地方,路过大佬多包涵.如果你是想深入学习小组件,建议您顺着笔者的编号顺序阅读本系列文章.如果曾经了 ...

  3. golang channel的行为

    1. 读nil的channel是永远阻塞的.关闭nil的channel会造成panic. 2. closed channel的行为: (1)向close的channel发消息会panic,关闭一个已经 ...

  4. windows CMD实现的信息收集工具

    bat1 @echo off echo ====================================================== echo [*] 所有盘符下的有趣文件 @For ...

  5. POJ 2762 单连通图

    题意:      给你一个有向图,问你这个图是不是单连通图,单连通就是任意两点之间至少存在一条可达路径. 思路:      先强连通所点,重新建图,此时的图不存在环,然后我们在看看是否存在一条路径可以 ...

  6. Average Score39届亚洲赛牡丹江站A题

    题意:       A班有n个人,B班有m个人,然后现在给你n-1个A班人的成绩,和m个B班人的成绩,然后题目要求求出A班剩下的没给成绩那个人的成绩范围,要求是这个人从A班转到B班后能使A,B的平均分 ...

  7. Dockerfile多阶段构建

    多阶段构建 之前的做法: 在Docker17.05版本之前,构建Docker镜像,通常采用两种方式: 1.全部放入一个Dockerfile 一种方式是将所有的构建过程全都包含在一个Dockerfile ...

  8. 死磕到底RecyclerView | RecyclerView 的滚动是怎么实现的?

    RecyclerView 是一个展示列表的控件,其中的子控件可以被滚动.这是怎么实现的?以走查源码的方式一探究竟. 切入点:滚动事件 阅读源码时,如何在浩瀚的源码中选择合适的切入点很重要,选好了能少走 ...

  9. Nacos 1.3.2 启动报错[db-load-error]load jdbc.properties error

    原因: 1.3.2版本Nacos默认启动模式为集群,在startup.cmd文件中第27行可以看到. 解决办法: 一.选择以默认的集群方式启动,就需要配置集群所需环境: 1.创建持久化数据库,推荐使用 ...

  10. sharding JDBC 不支持批量导入解决方法

    package com.ydmes.service.impl.log; import com.ydmes.domain.entity.log.BarTraceBackLog;import org.sp ...