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. 批量更新数据(BatchUpdate)

    批量更新数据(BatchUpdate) /// <summary> /// 批量更新数据,注意:如果有timestamp列,要移除 /// </summary> /// < ...

  2. go变量和声明

    go变量和声明 这将是美好的开始和结束,通过写下x = 4,我们查看变量,可以说声明了一个变量并赋值,但是很不幸,go语言变量声明和赋值比这更复杂.通过学习一些简单的示例开始学习变量声明和赋值.然后在 ...

  3. CSS:CSS 边框

    ylbtech-CSS:CSS 边框 1.返回顶部 1. CSS 边框 CSS 边框属性 边框样式 边框样式属性指定要显示什么样的边界.  border-style属性用来定义边框的样式 border ...

  4. 【前端控件】JQuery datepicker 日期控件设置

    datepicker控件可通过参数设置进行语言切换,以下可实现,系统所有日期控件默认为中文,在特定页面或者特定条件下可切换成英语!~ HTML: <!DOCTYPE html> <h ...

  5. 屏幕左侧鼠标常驻,隐藏部分显示,文章鼠标常驻,隐藏部分隐藏(我的hexo next博客)

    文章目录 如图 功能 代码 博客地址:https://mmmmmm.me 源码:https://github.com/dataiyangu?tab=repositories 如图 功能 最左侧添加透明 ...

  6. Codeforces 1191A Tokitsukaze and Enhancement

    题目链接:http://codeforces.com/problemset/problem/1191/A 思路:枚举 16 种情况输出最高的就行. AC代码: #include<bits/std ...

  7. Gerrit(0): Install and Config

    Install(Ubuntu 17.04): apt-get install default-jre daemon [nginx] #Other OS: install openjdk8-jre [n ...

  8. Git 学习第三天(二)

    默认情况下, Git合并是采用"fast forward"模式,但这种模式下,如果删除分支,会丢掉分支信息 禁用 fast forward 模式: git merge --no-f ...

  9. Bootstrap入门及其常用内置实现

    BootStrap是一个专门做页面的 1.BS是基于HTML CSS JS 的一个前端框架(半成品) 2.预定义了一套CSS样式与JQurey实现 3.BS和Validation类似,都是JQ的插件, ...

  10. 567. Permutation in String【滑动窗口】

    Given two strings s1 and s2, write a function to return true if s2 contains the permutation of s1. I ...