bootstrap 更改container 的width
参考: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的更多相关文章
- bootstrap中container和container-fluid的区别与用法
对bootstrap框架有一定了解的朋友都知道,一般页面布局中的开头会使用到container或container-fluid类,那么它们有什么区别呢?不急!下面为您讲解. 我们先来看看官方对这两个类 ...
- 记一个bootstrap定制container导致页面X轴出现横向滚动条的坑
壹 ❀ 引 在bootstrap定制时,因为UI给的图纸的页面主体部分宽度为1200px,所以我将container容器宽度从默认的1170px改成了1200px,随后在页面缩小的调试过程中发现了页 ...
- [Bootstrap] 1. container & container-fluid
Container: 居中 <!DOCTYPE html> <html> <head> <title>Blasting Off With Bootstr ...
- 【bootstrap】.container与.container_fluid
.container与.container_fluid是bootstrap中的两种不同类型的外层容器,区别是: .container 类用于固定宽度并支持响应式布局的容器.不用你自己设宽度,通过< ...
- Bootstrap中container与container-fluid的区别
/*0-768px以上宽度container为100%*/ .container { padding-right: 15px; padding-left: 15px; margin-right: au ...
- Expanded, SingleChildScrollView, CustomScrollView, container, height, width
SingleChildScrollView, CustomScrollView, container, init: double.inifinity. then use Expanded to con ...
- bootstrap中container和container-fluid的区别
container和container-fluid 在bootstrap中,两者都是设置文本居中,但是它们还是有很大差别的 container 是随屏幕宽度的变化而变化的,是阶段性变化,有一个随浏览器 ...
- jekyll bootstrap更改主题theme
使用主题 介绍: 由于JB版本号0.2.X的主题,如今全然是模块化的.他们跟踪和单独版本号的主题包. 这让每一个人都能够自由公布和共享主题. Jekyll-Bootstrap v 0.2.x仅仅附带t ...
- bootstrap中container 类和container-fluid类的区别container类所谓的自适应也是通过margin的改变来完成,container-fluid类的百分百宽度是指在固有的15px的padding前提下宽度总是当前视口的宽度。
container 类和container-fluid类的区别体现在是否有随视口宽度改变的margin存在. container类所谓的自适应也是通过margin的改变来完成,container-fl ...
随机推荐
- perl 打开和关闭文件
#!/usr/bin/perl -w use strict; #print "please input a string\n"; #my $line = <STDIN> ...
- leetcode Remove Element python
class Solution(object): def removeElement(self, nums, val): """ :type nums: List[int] ...
- json 的 使用方法以及与数组的区别
JSON简介,全称是JavaScript Object Notation.它是基于JavaScript编程语言ECMA-262 3rd Edition-December 1999标准的一种轻量级的数据 ...
- #pragma anon_unions, #pragma no_anon_unions
#pragma anon_unions, #pragma no_anon_unions 这些编译指示启用和禁用对匿名结构和联合的支持. 缺省设置 缺省值为 #pragma no_anon_unions ...
- 《Linux 设备驱动程序》读后感。 并发,竞态,死锁。
1. 概念 并发:在操作系统中,是指一个时间段中有几个程序都处于已启动运行到运行完毕之间,且这几个程序都是在同一个处理机上运行,但任一个时刻点上只有一个程序在处理机上运行. 来源: 1. Linux ...
- UVA507-- Jill Rides Again
题目链接:http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...
- Spring构造器注入、set注入和注解注入
记得刚开始学spring的时候,老师就反复的提到依赖注入和切面,平常的java开发中,在某个类中需要依赖其它类的方法,则通常是new一个依赖类再调用类实例的方法,这种方法耦合度太高并且不容易测试,sp ...
- Pig Latin儿童黑话(java)
●假设单词以辅音字母開始,将词首的辅音字母字符串(第一个元音字母前的全部字母)从单词的开头移动到末尾,然后加上后缀ay,这样就形成了它的pig latin. ●假设单词以元音字母開始,仅仅须要 ...
- asp.net ToString()方法介绍
C 货币 2.5.ToString("C") ¥2.50 D 十进制数 25.ToString("D5") 00025 E 科学型 25000.ToStri ...
- JavaScript之获取和设置元素属性
1.与我前面的随笔获取元素的那些方法不同http://www.cnblogs.com/GreenLeaves/p/5689075.html 获取元素属性的方法getAttribute()不属于docu ...