Bootstrap Bootstrap3 与 Bootstrap4 的区别
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 的区别的更多相关文章
- Bootstrap3和Bootsrap4的区别
Bootstrap3和Bootstap4的区别 1.Bootsrap4 css文件减少了40%以上 2.Bootsrap4已经不支持IE8以及IOS 6的支持 3.多了些类好组件
- springboot:bootstrap和application有什么区别?
bootstrap和application区别: Spring Cloud 构建于 Spring Boot 之上,在 Spring Boot 中有两种上下文,一种是 bootstrap,另外一种是 a ...
- <bootstrap>bs2和3的区别</bootstrap>
实验室的list网站开始动工了,准备打算用bootstrap作布局. 大前天去本部停了长html5峰会大连站的讲演,着急往回赶,很多感兴趣的东西都没有听到,但是还是了解了一些html5的新特性 电脑端 ...
- spring cloud 配置文件application.yml和bootstrap.yml 的定位,区别和联系
最近在启用springcloud配置中心server的东西,在整理属性资源的时候,突然发现:用了这么久的springboot,为什么会配置两个属性文件同时存在(application.yml/prop ...
- spring cloud 配置文件application.yml和bootstrap.yml 的定位,区别和联系总算是有一点明白了
最近在启用springcloud配置中心server的东西,在整理属性资源的时候,突然发现:用了这么久的springboot,为什么会配置两个属性文件同时存在(application.yml/prop ...
- springboot(二):bootstrap和application有什么区别?
“SpringBoot专注于快速方便的开发单个个体微服务. SpringCloud是关注全局的微服务协调整理治理框架,它将SpringBoot开发的一个个单体微服务整合并管理起来, 为各个服务之间提供 ...
- twitter bootstrap 2.x 3.x区别
栅格系统 (Grid system)说个我认为比较重要的,相对于RC 1中的3层,现在有4层了 We now have .col-xs (phones), .col-sm (tablets), .co ...
- 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为我们提供了在线编译工具,可 ...
- Bootstrap4 网格系统
学习注意事项 col-*-* 第一个*是设备类型,第二个*是控件宽度的占比 屏幕被等分为12,col-1宽度是1/12,col-6宽度是50%,col-12宽度是100% 给应用了class的elem ...
随机推荐
- Github Pages(io) + 域名重定向 (手把手教你搭建个人网站)
好歹也成为了在读phd的人,拥有个人网站是个有排面有很必要的事儿~ 在这里利用Github Pages + 域名重定向,实现个人网站的光速搭建~ 1.0 Github Repositories 首先你 ...
- 呵呵,Semaphore,就这?
这是并发线程工具类的第二篇文章,在第一篇中,我们分析过 CountDownLatch 的相关内容,你可以参考 一文搞懂 CountDownLatch 用法和源码! 那么本篇文章我们继续来和你聊聊并发工 ...
- JavaWeb 补充(Json)
HTML DOM alert() 方法 定义和用法 alert() 方法用于显示带有一条指定消息和一个 OK 按钮的警告框. 参数 描述 message 要在 window 上弹出的对话框中显示的纯文 ...
- 解决WebStorm无法正确识别Vue3组合式API的问题
1 问题描述 Vue3的组合式API无法在WebStorm中正确识别,表现为defineComponent等无法被识别: 2 尝试方案 猜想这种问题的原因是无法正确识别对应的Vue3库,笔者相信Web ...
- 04.ElementUI源码学习:组件封装、说明文档的编写发布
0x00.前言 书接上文.项目经过一系列的配置,开发脚手架已经搭建完毕.接下来开始封装自定义组件.并基于 markdown 文件生成文档和演示案例. 后续文章代码会根据篇幅,不影响理解的情况下进行部分 ...
- Vue和Node.js交互之token
博主最近工作的时候,公司后台使用的JAVA,在做登陆时总会传来一个token然后我存在了本地存储中或Vuex中,之后每一次请求把它带在请求头上,然后就好奇想要自己做一个后台服务器然后做一个完整的登陆的 ...
- Asp.Net Core&CAP实现分布式事务
需要注意的是标题中的CAP不是指的CAP理论,而是园区大神杨晓东实现的框架,CAP框架基于本地消息表用最终一致性实现分布式事务. 本地消息表 首先我们考虑一个场景,在将用户信息更改后,需要发送一条消息 ...
- CSS快速入门基础篇,让你快速上手(附带代码案例)
1.什么是CSS 学习思路 CSS是什么 怎么去用CSS(快速上手) CSS选择器(难点也是重点) 网页美化(文字,阴影,超链接,列表,渐变等) 盒子模型 浮动 定位 网页动画(特效效果) 项目格式: ...
- 1.人工智能解读与Python简介
人工智能解读 Python解读 Python 简介 1.程序员: 程序设计人员. 2.程序: 一组计算机能识别和执行的指令,是实现某种需求的软件. 3.操作系统: 管理和控制计算机软件与硬件资源的程序 ...
- POJ1151基本的扫描线求面积
题意: 给定n个矩形的对角坐标,分别是左下和右上,浮点型,求矩形覆盖的面积. 思路: 基本的线段树扫描线求面积,没有坑点,不解释了,提示一点,有的题尤其是线段树扫描线的题需要离散 ...