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. php中的一些没有用过的,但是见到过的方法 函数

    strlen(); strlen 和 mb_strlen 都是用于获取字符串长度的, 其中 strlen 只针对单字节编码字符,也就是说它计算的是 字符串的总字节数,如果是多字节编码,如 gbk 和 ...

  2. 记一次go中map并发引起的事故

    错误使用map引发的血案 前言 场景复原 原因 参考 错误使用map引发的血案 前言 最近业务中,同事使用map来接收返回的结果,使用waitGroup来并发的处理执行返回的结果,结果上线之后,直接崩 ...

  3. 使用IDEA模拟git命令使用的常见场景

    目录 使用IDEA模拟git命令使用的常见场景 前期准备 新建一个远程仓库 在一个文件夹内建立两个子文件夹作为两个本地仓库的存放位置 本地仓库与远程仓库建立联系 模拟两个用户协同开发的场景(使用IDE ...

  4. ASP检测客户是否取消微信公众号

    有时因为项目内需要用到检测客户是否已经取消关注微信公众号,只有没被取消执行相关模板信息发送.图文信息发送.视频语音等信息发送给客户才有意义.也可以知道多少客户还在我们的微信公众号关注内.方便后期做公众 ...

  5. 什么是响应式web设计

    什么是响应式web设计 现在开发一个产品,基本上都会需要兼顾 PC端和 移动端. 一般有两种思路: 1.为每个终端做一个特定的版本,并给2级域名,根据终端环境调用不同的版本代码. 2.一个网站能够兼容 ...

  6. hdu4768 非常规的二分

    题意:       n个社团给同学发传单,同学一共有1--2^31这么多,每个社团有三个数A ,B ,C ,只有 满足 A ,A + C ,A + C + C ...A + KC <= B 的学 ...

  7. Python小游戏 -- 猜单词

    Python初学者小游戏:猜单词 游戏逻辑:就像我们曾经英语学习机上的小游戏一样,电脑会从事先预置的词库中抽取单词,然后给出单词的字母数量,给定猜解次数,然后让玩家进行猜测,并给出每次猜测的正确字母与 ...

  8. POJ1236 强连通 (缩点后度数的应用)

    题意:       一些学校有一个发送消息的体系,现在给你一些可以直接发送消息的一些关系(单向)然后有两个问题 (1) 问你至少向多少个学校发送消息可以让所有的学校都得到消息 (2) 问至少加多少条边 ...

  9. Python第四章-字典

    第四章 字典-当索引不好用时 4.0     字典可以理解成是C++里的map,可以映射任何类型.字典这种结构类型称为映射(mapping).   字典是Python中唯一内建的映射类型,字典中的值并 ...

  10. Tomcat反序列化漏洞(CVE-2016-8735)

    目录​​​​​​​ CVE-2016-8735 漏洞复现 漏洞修复: CVE-2016-8735 漏洞描述: 该漏洞与之前Oracle发布的 mxRemoteLifecycleListener 反序列 ...