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. Github Pages(io) + 域名重定向 (手把手教你搭建个人网站)

    好歹也成为了在读phd的人,拥有个人网站是个有排面有很必要的事儿~ 在这里利用Github Pages + 域名重定向,实现个人网站的光速搭建~ 1.0 Github Repositories 首先你 ...

  2. 呵呵,Semaphore,就这?

    这是并发线程工具类的第二篇文章,在第一篇中,我们分析过 CountDownLatch 的相关内容,你可以参考 一文搞懂 CountDownLatch 用法和源码! 那么本篇文章我们继续来和你聊聊并发工 ...

  3. JavaWeb 补充(Json)

    HTML DOM alert() 方法 定义和用法 alert() 方法用于显示带有一条指定消息和一个 OK 按钮的警告框. 参数 描述 message 要在 window 上弹出的对话框中显示的纯文 ...

  4. 解决WebStorm无法正确识别Vue3组合式API的问题

    1 问题描述 Vue3的组合式API无法在WebStorm中正确识别,表现为defineComponent等无法被识别: 2 尝试方案 猜想这种问题的原因是无法正确识别对应的Vue3库,笔者相信Web ...

  5. 04.ElementUI源码学习:组件封装、说明文档的编写发布

    0x00.前言 书接上文.项目经过一系列的配置,开发脚手架已经搭建完毕.接下来开始封装自定义组件.并基于 markdown 文件生成文档和演示案例. 后续文章代码会根据篇幅,不影响理解的情况下进行部分 ...

  6. Vue和Node.js交互之token

    博主最近工作的时候,公司后台使用的JAVA,在做登陆时总会传来一个token然后我存在了本地存储中或Vuex中,之后每一次请求把它带在请求头上,然后就好奇想要自己做一个后台服务器然后做一个完整的登陆的 ...

  7. Asp.Net Core&CAP实现分布式事务

    需要注意的是标题中的CAP不是指的CAP理论,而是园区大神杨晓东实现的框架,CAP框架基于本地消息表用最终一致性实现分布式事务. 本地消息表 首先我们考虑一个场景,在将用户信息更改后,需要发送一条消息 ...

  8. CSS快速入门基础篇,让你快速上手(附带代码案例)

    1.什么是CSS 学习思路 CSS是什么 怎么去用CSS(快速上手) CSS选择器(难点也是重点) 网页美化(文字,阴影,超链接,列表,渐变等) 盒子模型 浮动 定位 网页动画(特效效果) 项目格式: ...

  9. 1.人工智能解读与Python简介

    人工智能解读 Python解读 Python 简介 1.程序员: 程序设计人员. 2.程序: 一组计算机能识别和执行的指令,是实现某种需求的软件. 3.操作系统: 管理和控制计算机软件与硬件资源的程序 ...

  10. POJ1151基本的扫描线求面积

    题意:      给定n个矩形的对角坐标,分别是左下和右上,浮点型,求矩形覆盖的面积. 思路:       基本的线段树扫描线求面积,没有坑点,不解释了,提示一点,有的题尤其是线段树扫描线的题需要离散 ...