container和container-fluid

在bootstrap中,两者都是设置文本居中,但是它们还是有很大差别的

container

是随屏幕宽度的变化而变化的,是阶段性变化,有一个随浏览器变化而变化的margin,总结就是:

如果屏幕小于768的话,最大宽度是自动的(满屏)

如果屏幕大于768小于992的话,最大宽度是750

如果屏幕大于992小于1200的话,最大宽度是970

如果屏幕大于1200,最大宽度是1170

container-fluid

始终保持100%的宽度,margin=0,这个margin正是container的作用原理

bootstrap中container和container-fluid的区别的更多相关文章

  1. bootstrap3中container与container_fluid容器的区别

    声明:转自 CSDN博客 .container与.container_fluid是bootstrap中的两种不同类型的外层容器,按照官方的说法,这两者的区别是: .container 类用于固定宽度并 ...

  2. bootstrap中的.container类定义

    bootstrap中的.container类定义 .container{ padding-right:15px; padding-left:15px; margin-right:auto; margi ...

  3. Bootstrap学习记录-2.container和table

    1. Container Bootstrap中容器类提供了2个类标识:container.container-fluid. 两者的区别在于: container:容器不止有15px的padding,还 ...

  4. ssh远程连接docker中的 linux container

    ssh远程连接docker中的container   由于工作需要,要远程连接Container,本地机器是windows,以下为解决步骤: 1. 环境 本地:Windows ↓ Docker版本1. ...

  5. bootstrap中的Tooltips工具提示的使用问题

    在使用bootstrap中的Tooltips时,官方文档中的实例代码若直接放在.container 或 .container-fluid类中时,四个button悬停之后会把button之间的margi ...

  6. jQuery中的bind() live() delegate()之间区别分析

    jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...

  7. jsp中的contentType与pageEncoding的区别和作用

    jsp中的contentType与pageEncoding的区别和作用   <%@ page contentType="text/html; charset=utf-8" p ...

  8. 57、Bootstrap中文文档

    给大家介绍一个前端框架让你从此写起前端代码与之先前相比如有神助般的效果拉就是Bootstrap. 一.Bootstrap的下载 Bootstrap,由Twitter的设计师Mark Otto和Jaco ...

  9. bootstrap 自适应和响应式布局的区别

    自适应:  不管屏幕多大,都尽量不换行,而只是横向缩放. 响应式: 屏幕变小了之后,属于同一行的元素受到挤压后,行的右边元素自动换行显式: 屏幕大了后,本属于同一行的元素尽可能的排在同一行内: boo ...

随机推荐

  1. Shiro学习(24)在线回话管理

    有时候需要显示当前在线人数.当前在线用户,有时候可能需要强制某个用户下线等:此时就需要获取相应的在线用户并进行一些操作. 本章基于<第十六章 综合实例>代码构建. 会话控制器 Java代码 ...

  2. java在acm中常用基础技巧方法

    java在acm中常用基础技巧方法 如果学到了新的技巧,本博客会更新~ input input-std @Frosero import java.util.*; public class Main { ...

  3. 51nod-1366 贫富差距——并查集

    题目链接:https://www.51nod.com/onlineJudge/questionCode.html#!problemId=1366 #include <iostream> # ...

  4. Go语言基础:make,new, len, cap, append, delete方法

      前面提到不少Go的内建函数,这篇文章学习下如何使用.. make 先拿 make 开刀,可是一开始我就进入了误区,因为我想先找到他的源码,先是发现 src/builtin/builtin.go 中 ...

  5. CentOS6 图形界面(gnome)安装

    CentOS6相对于CentOS5的安装有了不少的进步,有不少默认的选项可以选择,如: Desktop :基本的桌面系统,包括常用的桌面软件,如文档查看工具. Minimal Desktop :基本的 ...

  6. 20. Jmeter抓包之APP请求

    APP测试过程中我们经常需要抓包,通常我们使用fiddler或者Charles.但是jmeter也可以抓包,而且非常好用,闲话不多说,下面进入正题. 步骤: 1.选择测试计划,添加线程组 2.选择工作 ...

  7. could not stop cortex-m device

    检查一下STM32复位管脚是不是0V,如果是0V的话并且你有上拉电阻,那么就断电后检查一下STM32的VCC和GND是否短路,我的就是两个贴片电容击穿造成的短路从而使RST无法拉高.

  8. Webpack4篇

    [Webpack4篇] webpack4 打包优化策略 当前依赖包的版本 1 优化loader配置 1.1 缩小文件匹配范围(include/exclude) 通过排除node_modules下的文件 ...

  9. Java高级进阶:自定义ClassLoader

    假如我们的类不在classpath下,而我们又想读取一个自定义的目录下的class,如果做呢? 读取自定义目录的类 示例读取c:/test/com/test.jdk/Key.class这个类. pac ...

  10. Python爬虫工程师必学APP数据抓取实战✍✍✍

    Python爬虫工程师必学APP数据抓取实战  整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的感受,单论单个知识点课程本身没问题,大 ...