文档章节

.container 与.container-fluid的区别

周宇YuZhou
 周宇YuZhou
发布于 2015/04/02 12:11
字数 130
阅读 20
收藏 0

从下面的代码可以看出两者的区别:

@media (min-width: 568px) {
  .container {
    width: 550px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}

根据见面的视窗大小,container给div指定了固定的宽度,如果当前视窗是1000px(>992px),因而它限定的宽度就是970px,当视窗宽度增加直到1200px时,它限定的宽度会跳到1170px。

而类似的限制没有应用在container-fluid上,因此它的宽度是随着视窗改变而改变的。

© 著作权归作者所有

共有 人打赏支持
周宇YuZhou
粉丝 15
博文 40
码字总数 17591
作品 0
技术主管
私信 提问
使用Boostrap,左侧菜单栏固定宽度,右侧自适应宽度。

1、需求和问题 因为Bootstrap框架是自适应布局的。所以当把菜单栏放在 .col-*-n 的时候。菜单栏会根据浏览器窗口的大小进行缩放调整。从而会产生很多问题。比如与头部导航栏对齐的问题。比如...

Asktao
2016/04/05
3.2K
0
Bootstrap---Fluid layout 流布局

流布局是一种适应屏幕的做法。即不固定块的宽度,而是采用百分比作为单位来确定每一块的宽度。这种布局非常适合一次编写,然后自适应各种不同大小的屏幕(手机,PAD…)。 <div class="cont...

娲城小将
2014/08/25
0
0
我的css为什么没有运用到我的网页中去

我的html file里面有写 这是我radmin-responsive.css里的一小部分: @media (min-width: 980px) and (max-width: 1200px) { div.container-fluid.content-wrapper { padding-right: 17px; }......

milktwpearl
2013/07/01
819
6
bootstrap入门1

作为back-end也用了一段时间的bt,但是对其或者说对front-end就不是特别了解,在从新学习之际,写此已做记录。 1 container, container-fluid 两个最基本要素是相同的,只不过container添加了...

小昭归来
2016/10/11
1
0

没有更多内容

加载失败,请刷新页面

加载更多

大数据教程(7.6)shell脚本定时采集日志数据到hdfs

上一篇博客博主分享了hadoop内置rpc的使用案例,本节博主将为小伙伴们分享一个在实际生产中使用的日志搜集案例。前面的文章我们有讲到过用户点击流日志分析的流程,本节就是要完成这个分析流...

em_aaron
27分钟前
1
0
wave和pcm互转

wav->pcm pcm->wav c#代码: using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;using System.Drawing;using System.IO;using Sys......

whoisliang
29分钟前
1
0
Win10:默认的图片打开应用,打开图片时速度明显很慢的解决办法

首先,我们随便地打开一张图片。然后,点击右上角的三个小点,最后点击弹出菜单最下面的“设置”。如下图: 在“设置”中找到下面的“人物”,把它关掉就好了。 原来,默认情况下,Win 10的图...

LivingInFHL
今天
3
0
js代码激发onchange事件,兼容谷歌火狐IE

var el = document.getElementsByName('role')[0]; el.value = '3'; var evt = document.createEvent("HTMLEvents"); evt.initEvent("change", false, true); el.dispatchEvent(evt);......

我退而结网
今天
4
0
mysql客户端报错:libmysqlclient_16 not defined in file libmysqlclient.so.16

报错情况: 安装完mydumper之后(上一篇文章),登陆Mysql客户端报错:version libmysqlclient_16 not defined in file libmysqlclient.so.16 with link time reference 同样:mysql的其他客...

machogyb
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部