参考:http://stackoverflow.com/questions/15884102/bootstrap-how-do-i-change-the-width-of-the-container

怎么更改contianer 的width?

这样.container{ width:xxx;}

就可以了吗?

错。that will break everything, since each span class has a fixed width which is calculated in relation to thecontainer width.所有我们必须重新计算span1-span12的width。

解决办法:

假设我们想设置widht为1000px.去

Go to the Customize section on Bootstrap site and choose the size you prefer. You'll have to set@gridColumnWidth and @gridGutterWidth variables.

For example: @gridColumnWidth = 65px and @gridGutterWidth = 20px results on a 1000pxlayout.

Then download it.

是怎么计算的?

12*(gridColumnWidth+gridGutterWidth)-gridGutterWidth=your width.

Theoretically, there are infinite combinations that match 1000px. An example: 12*65 + 11*20 = 1000 (there are only 11 gutters between columns).

bootstrap 更改container 的width的更多相关文章

  1. bootstrap中container和container-fluid的区别与用法

    对bootstrap框架有一定了解的朋友都知道,一般页面布局中的开头会使用到container或container-fluid类,那么它们有什么区别呢?不急!下面为您讲解. 我们先来看看官方对这两个类 ...

  2. 记一个bootstrap定制container导致页面X轴出现横向滚动条的坑

     壹 ❀ 引 在bootstrap定制时,因为UI给的图纸的页面主体部分宽度为1200px,所以我将container容器宽度从默认的1170px改成了1200px,随后在页面缩小的调试过程中发现了页 ...

  3. [Bootstrap] 1. container & container-fluid

    Container: 居中 <!DOCTYPE html> <html> <head> <title>Blasting Off With Bootstr ...

  4. 【bootstrap】.container与.container_fluid

    .container与.container_fluid是bootstrap中的两种不同类型的外层容器,区别是: .container 类用于固定宽度并支持响应式布局的容器.不用你自己设宽度,通过< ...

  5. Bootstrap中container与container-fluid的区别

    /*0-768px以上宽度container为100%*/ .container { padding-right: 15px; padding-left: 15px; margin-right: au ...

  6. Expanded, SingleChildScrollView, CustomScrollView, container, height, width

    SingleChildScrollView, CustomScrollView, container, init: double.inifinity. then use Expanded to con ...

  7. bootstrap中container和container-fluid的区别

    container和container-fluid 在bootstrap中,两者都是设置文本居中,但是它们还是有很大差别的 container 是随屏幕宽度的变化而变化的,是阶段性变化,有一个随浏览器 ...

  8. jekyll bootstrap更改主题theme

    使用主题 介绍: 由于JB版本号0.2.X的主题,如今全然是模块化的.他们跟踪和单独版本号的主题包. 这让每一个人都能够自由公布和共享主题. Jekyll-Bootstrap v 0.2.x仅仅附带t ...

  9. bootstrap中container 类和container-fluid类的区别container类所谓的自适应也是通过margin的改变来完成,container-fluid类的百分百宽度是指在固有的15px的padding前提下宽度总是当前视口的宽度。

    container 类和container-fluid类的区别体现在是否有随视口宽度改变的margin存在. container类所谓的自适应也是通过margin的改变来完成,container-fl ...

随机推荐

  1. leetcode Linked List Cycle python

    # Definition for singly-linked list. # class ListNode(object): # def __init__(self, x): # self.val = ...

  2. JVM学习之强引用、弱引用、软引用、虚引用

    转自:http://my.oschina.net/ydsakyclguozi/blog/404389 多谢博主分享 1.强引用(StrongReference) 强引用是使用最普遍的引用.如果一个对象 ...

  3. python 杨辉三角 算法实现

    def triangles(level): n = 1 L = [] while n <=level: if n <= 2: L.append(1) yield L elif n > ...

  4. 诞生于饭桌上的jcSQL语言

    相信每个Coder都有心在自己求学阶段可以写一门自己的语言,无论是毕业设计,还是课余爱好:不管是为了提升B格,还是想练手,抑或对其他语言不满,想自己撸一个,只要坚持下去了,都是不错的理由. 现在正值暑 ...

  5. MySQL二进制日志中保存的上下文信息

    1.二进制日志中要保存上下文的原因 二进制日志是要在slave端重放的,记录上下文信息,是为了保证主丛数据库的一致.如rand一个随机数,在主上返回的可以有是100,在从上返回的可能就是1000了. ...

  6. SQL Server 全文索引

    create table Document(ID int not null,Name nvarchar(255) not null,Body nvarchar(max) not null);go cr ...

  7. Oracle EBS-SQL (BOM-2):检查期间Bom的更改记录数.sql

    Select MSI1.Segment1          上层编码,       MSI1.Description           上层描述,       MSI2.Segment1       ...

  8. 限制ITEM读取其它物料的物料描述

    应用 Oracle   Purchasing 层 Level Function 函数名 Funcgtion Name CUXPOXPOEPO 表单名 Form Name POXPOEPO 说明 Des ...

  9. Linux LVM硬盘管理及LVM分区扩容

    LVM磁盘管理 一.LVM简介... 1 二. LVM基本术语... 2 三. 安装LVM... 3 四. 创建和管理LVM... 4 2. 创建PV.. 6 3. 创建VG.. 7 4. 创建LV. ...

  10. delphi中覆盖最大化消息(WM_GETMINMAXINFO)

    unit Unit1; interface uses Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs; ...