bootstrap中container类和container-fluid类的区别
container和container-fluid到底什么区别。
查了很多资料,看到很多人和我有同样的疑问,但是下面的回答一般都是一个是响应式一个宽度是百分百
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Hello World</title> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> </head> <body> <div class="container"> <h3>hello world</h3> </div> <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script> <script type="text/javascript" src="js/bootstrap.min.js"></script> </body> </html>
写完之后打开浏览器,f12后发现containe
r容器不止有15px的padding
,还有一个会随着浏览器宽度变化而变化的margin
,如图
上图的盒模型为我在满屏时的数值,对浏览器进行缩放会有增加或减少的变化,具体请自己试验,实践出真知嘛。
container-fluid demo
当把类换成container-fluid
之后,你会发现页面有明显的变化
,如图
再看盒模型
你会发现这次整个容器就只有固定的15px的padding
,并没有再加margin
。
结论 container
类和container-fluid
类的区别体现在是否有随视口宽度改变的margin
存在。 container
类所谓的自适应也是通过margin
的改变来完成,container-fluid
类的百分百宽度是指在固有的15px的padding
前提下宽度总是当前视口的宽度。
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
Python---20行代码爬取斗鱼平台房间数据(下)
在上一篇中,已经详细的讲解了如何获取数据,接下来是深度处理数据,这里调用xlsxwriter库来制作Excel表格。 工具:Python3.6.5,Pycharm 1.模块介绍 XlsxWriter模块具有的功能: 100%兼容Excel的*.xlsx文件,支持Excel2003,Excel2007等版本 (Excel2003-和Excel2007的拓展名为*.xls) 支持所有Excel单元格数据格式 单元格合并、批注、自动筛选、丰富多格式字符串等 支持工作表JPG、PNG图像,自定义图标 内存优化模式支持写入大文件 2.模块安装 pip install xlsxwriter # 在命令行中输入此代码 # 目前最新版本为1.0.0,官网文档介绍支持Python2.5-3.5,但目前使用Python3.6未发生异常 模块的具体用法可以参考这两个网站(感谢这两个网站提供解释):官方xlsxwriter解释CSDN吴芒果:XlsxWriter模块实现Excel操作 3.模块使用 import xlsxwriter workbook = xlsxwriter.Workbook('Demo1....
- 下一篇
Java堆和栈的区别和介绍以及JVM的堆和栈
Java堆和栈的区别和介绍以及JVM的堆和栈 一、Java的堆内存和栈内存 Java把内存划分成两种:一种是堆内存,一种是栈内存。 堆:主要用于存储实例化的对象,数组。由JVM动态分配内存空间。一个JVM只有一个堆内存,线程是可以共享数据的。 栈:主要用于存储局部变量和对象的引用变量,每个线程都会有一个独立的栈空间,所以线程之间是不共享数据的。 在函数中定义的一些基本类型的变量和对象的引用变量都在函数的栈内存中分配。 当在一段代码块定义一个变量时,Java就在栈中为这个变量分配内存空间,当超过变量的作用域后,Java会自动释放掉为该变量所分配的内存空间,该内存空间可以立即被另作他用。 堆内存用来存放由new创建的对象和数组。 在堆中分配的内存,由Java虚拟机的自动垃圾回收器来管理。 二、栈与堆的共同点和优缺点 栈(stack)与堆(heap)都是Java用来在Ram中存放数据的地方。与C++不同,Java自动管理栈和堆,程序员不能直接地设置栈或堆。 栈的优势是,存取速度比堆要快,仅次于直接位于CPU中的寄存器。但缺点是,存在栈中的数据大小与生存期必须是确定的,缺乏灵活性。另外,栈数据...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
推荐阅读
最新文章
- SpringBoot2初体验,简单认识spring boot2并且搭建基础工程
- CentOS7,CentOS8安装Elasticsearch6.8.6
- CentOS7编译安装Gcc9.2.0,解决mysql等软件编译问题
- SpringBoot2配置默认Tomcat设置,开启更多高级功能
- SpringBoot2更换Tomcat为Jetty,小型站点的福音
- CentOS7编译安装Cmake3.16.3,解决mysql等软件编译问题
- CentOS关闭SELinux安全模块
- CentOS8编译安装MySQL8.0.19
- Linux系统CentOS6、CentOS7手动修改IP地址
- SpringBoot2编写第一个Controller,响应你的http请求并返回结果